mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
* filtering country map by transaction name * filtering country map by transaction name * filtering country map by transaction name
This commit is contained in:
parent
49e8a0a9a3
commit
ab7fa7aa10
9 changed files with 53 additions and 26 deletions
9
x-pack/legacy/plugins/apm/common/transaction_types.ts
Normal file
9
x-pack/legacy/plugins/apm/common/transaction_types.ts
Normal file
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
export const TRANSACTION_PAGE_LOAD = 'page-load';
|
||||
export const TRANSACTION_ROUTE_CHANGE = 'route-change';
|
||||
export const TRANSACTION_REQUEST = 'request';
|
|
@ -19,7 +19,7 @@ export const ChoroplethToolTip: React.SFC<{
|
|||
<div style={{ fontSize: fontSizes.large }}>{name}</div>
|
||||
<div>
|
||||
{i18n.translate(
|
||||
'xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.avgPageLoadDuration',
|
||||
'xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.avgPageLoadDuration',
|
||||
{
|
||||
defaultMessage: 'Avg. page load duration:'
|
||||
}
|
||||
|
@ -31,7 +31,7 @@ export const ChoroplethToolTip: React.SFC<{
|
|||
<div>
|
||||
(
|
||||
{i18n.translate(
|
||||
'xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.countPageLoads',
|
||||
'xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.countPageLoads',
|
||||
{
|
||||
values: { docCount: asInteger(docCount) },
|
||||
defaultMessage: '{docCount} page loads'
|
||||
|
|
|
@ -10,7 +10,7 @@ import React from 'react';
|
|||
import { useAvgDurationByCountry } from '../../../../../hooks/useAvgDurationByCountry';
|
||||
import { ChoroplethMap } from '../ChoroplethMap';
|
||||
|
||||
export const PageLoadCharts: React.SFC = () => {
|
||||
export const DurationByCountryMap: React.SFC = () => {
|
||||
const { data } = useAvgDurationByCountry();
|
||||
|
||||
return (
|
||||
|
@ -20,7 +20,7 @@ export const PageLoadCharts: React.SFC = () => {
|
|||
<EuiTitle size="xs">
|
||||
<span>
|
||||
{i18n.translate(
|
||||
'xpack.apm.metrics.pageLoadCharts.avgPageLoadByCountryLabel',
|
||||
'xpack.apm.metrics.durationByCountryMap.avgPageLoadByCountryLabel',
|
||||
{
|
||||
defaultMessage:
|
||||
'Avg. page load duration distribution by country'
|
|
@ -34,7 +34,12 @@ import { LicenseContext } from '../../../../context/LicenseContext';
|
|||
import { TransactionLineChart } from './TransactionLineChart';
|
||||
import { isValidCoordinateValue } from '../../../../utils/isValidCoordinateValue';
|
||||
import { getTimeFormatter } from '../../../../utils/formatters';
|
||||
import { PageLoadCharts } from './PageLoadCharts';
|
||||
import { DurationByCountryMap } from './DurationByCountryMap';
|
||||
import {
|
||||
TRANSACTION_PAGE_LOAD,
|
||||
TRANSACTION_ROUTE_CHANGE,
|
||||
TRANSACTION_REQUEST
|
||||
} from '../../../../../common/transaction_types';
|
||||
|
||||
interface TransactionChartProps {
|
||||
hasMLJob: boolean;
|
||||
|
@ -55,8 +60,6 @@ const ShiftedEuiText = styled(EuiText)`
|
|||
top: 5px;
|
||||
`;
|
||||
|
||||
const RUM_PAGE_LOAD_TYPE = 'page-load';
|
||||
|
||||
export class TransactionCharts extends Component<TransactionChartProps> {
|
||||
public getMaxY = (responseTimeSeries: TimeSeries[]) => {
|
||||
const coordinates = flatten(
|
||||
|
@ -200,19 +203,19 @@ export class TransactionCharts extends Component<TransactionChartProps> {
|
|||
</EuiPanel>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGrid>
|
||||
{transactionType === RUM_PAGE_LOAD_TYPE ? (
|
||||
{transactionType === TRANSACTION_PAGE_LOAD && (
|
||||
<>
|
||||
<EuiSpacer size="s" />
|
||||
<PageLoadCharts />
|
||||
<DurationByCountryMap />
|
||||
</>
|
||||
) : null}
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function tpmLabel(type?: string) {
|
||||
return type === 'request'
|
||||
return type === TRANSACTION_REQUEST
|
||||
? i18n.translate(
|
||||
'xpack.apm.metrics.transactionChart.requestsPerMinuteLabel',
|
||||
{
|
||||
|
@ -229,14 +232,14 @@ function tpmLabel(type?: string) {
|
|||
|
||||
function responseTimeLabel(type?: string) {
|
||||
switch (type) {
|
||||
case RUM_PAGE_LOAD_TYPE:
|
||||
case TRANSACTION_PAGE_LOAD:
|
||||
return i18n.translate(
|
||||
'xpack.apm.metrics.transactionChart.pageLoadTimesLabel',
|
||||
{
|
||||
defaultMessage: 'Page load times'
|
||||
}
|
||||
);
|
||||
case 'route-change':
|
||||
case TRANSACTION_ROUTE_CHANGE:
|
||||
return i18n.translate(
|
||||
'xpack.apm.metrics.transactionChart.routeChangeTimesLabel',
|
||||
{
|
||||
|
|
|
@ -9,7 +9,7 @@ import { useUrlParams } from './useUrlParams';
|
|||
|
||||
export function useAvgDurationByCountry() {
|
||||
const {
|
||||
urlParams: { serviceName, start, end },
|
||||
urlParams: { serviceName, start, end, transactionName },
|
||||
uiFilters
|
||||
} = useUrlParams();
|
||||
|
||||
|
@ -24,13 +24,14 @@ export function useAvgDurationByCountry() {
|
|||
query: {
|
||||
start,
|
||||
end,
|
||||
uiFilters: JSON.stringify(uiFilters)
|
||||
uiFilters: JSON.stringify(uiFilters),
|
||||
transactionName
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
[serviceName, start, end, uiFilters]
|
||||
[serviceName, start, end, uiFilters, transactionName]
|
||||
);
|
||||
|
||||
return {
|
||||
|
|
|
@ -9,19 +9,26 @@ import {
|
|||
PROCESSOR_EVENT,
|
||||
SERVICE_NAME,
|
||||
TRANSACTION_DURATION,
|
||||
TRANSACTION_TYPE
|
||||
TRANSACTION_TYPE,
|
||||
TRANSACTION_NAME
|
||||
} from '../../../../common/elasticsearch_fieldnames';
|
||||
import { Setup } from '../../helpers/setup_request';
|
||||
import { rangeFilter } from '../../helpers/range_filter';
|
||||
import { TRANSACTION_PAGE_LOAD } from '../../../../common/transaction_types';
|
||||
|
||||
export async function getTransactionAvgDurationByCountry({
|
||||
setup,
|
||||
serviceName
|
||||
serviceName,
|
||||
transactionName
|
||||
}: {
|
||||
setup: Setup;
|
||||
serviceName: string;
|
||||
transactionName?: string;
|
||||
}) {
|
||||
const { uiFiltersES, client, config, start, end } = setup;
|
||||
const transactionNameFilter = transactionName
|
||||
? [{ term: { [TRANSACTION_NAME]: transactionName } }]
|
||||
: [];
|
||||
const params = {
|
||||
index: config.get<string>('apm_oss.transactionIndices'),
|
||||
body: {
|
||||
|
@ -30,8 +37,9 @@ export async function getTransactionAvgDurationByCountry({
|
|||
bool: {
|
||||
filter: [
|
||||
{ term: { [SERVICE_NAME]: serviceName } },
|
||||
...transactionNameFilter,
|
||||
{ term: { [PROCESSOR_EVENT]: 'transaction' } },
|
||||
{ term: { [TRANSACTION_TYPE]: 'page-load' } },
|
||||
{ term: { [TRANSACTION_TYPE]: TRANSACTION_PAGE_LOAD } },
|
||||
{ exists: { field: CLIENT_GEO_COUNTRY_ISO_CODE } },
|
||||
{ range: rangeFilter(start, end) },
|
||||
...uiFiltersES
|
||||
|
|
|
@ -150,14 +150,20 @@ export const transactionGroupsAvgDurationByCountry = createRoute(() => ({
|
|||
path: t.type({
|
||||
serviceName: t.string
|
||||
}),
|
||||
query: t.intersection([uiFiltersRt, rangeRt])
|
||||
query: t.intersection([
|
||||
uiFiltersRt,
|
||||
rangeRt,
|
||||
t.partial({ transactionName: t.string })
|
||||
])
|
||||
},
|
||||
handler: async (req, { path, query }) => {
|
||||
const setup = await setupRequest(req);
|
||||
const { serviceName } = path;
|
||||
const { transactionName } = query;
|
||||
|
||||
return getTransactionAvgDurationByCountry({
|
||||
serviceName,
|
||||
transactionName,
|
||||
setup
|
||||
});
|
||||
}
|
||||
|
|
|
@ -3631,9 +3631,9 @@
|
|||
"xpack.apm.localFilters.titles.transactionResult": "トランザクション結果",
|
||||
"xpack.apm.localFilters.titles.transactionType": "トランザクションタイプ",
|
||||
"xpack.apm.localFiltersTitle": "各種フィルター",
|
||||
"xpack.apm.metrics.pageLoadCharts.avgPageLoadByCountryLabel": "国ごとの平均ページ読み込み時間の分布",
|
||||
"xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.avgPageLoadDuration": "平均ページ読み込み時間:",
|
||||
"xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.countPageLoads": "{docCount} ページの読み込み",
|
||||
"xpack.apm.metrics.durationByCountryMap.avgPageLoadByCountryLabel": "国ごとの平均ページ読み込み時間の分布",
|
||||
"xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.avgPageLoadDuration": "平均ページ読み込み時間:",
|
||||
"xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.countPageLoads": "{docCount} ページの読み込み",
|
||||
"xpack.apm.settings.agentConf.configTable.editButtonDescription": "この構成を編集します",
|
||||
"xpack.apm.settings.agentConf.configTable.editButtonLabel": "編集",
|
||||
"xpack.apm.settings.agentConf.configTable.emptyPromptText": "変更しましょう。直接 Kibana からエージェント構成を微調整できます。再展開する必要はありません。まず、最初の構成を作成します。",
|
||||
|
|
|
@ -3632,9 +3632,9 @@
|
|||
"xpack.apm.localFilters.titles.transactionResult": "事务结果",
|
||||
"xpack.apm.localFilters.titles.transactionType": "事务类型",
|
||||
"xpack.apm.localFiltersTitle": "筛选",
|
||||
"xpack.apm.metrics.pageLoadCharts.avgPageLoadByCountryLabel": "页面加载平均时长分布(按国家/地区)",
|
||||
"xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.avgPageLoadDuration": "页面加载平均时长:",
|
||||
"xpack.apm.metrics.pageLoadCharts.RegionMapChart.ToolTip.countPageLoads": "{docCount} 个页面加载",
|
||||
"xpack.apm.metrics.durationByCountryMap.avgPageLoadByCountryLabel": "页面加载平均时长分布(按国家/地区)",
|
||||
"xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.avgPageLoadDuration": "页面加载平均时长:",
|
||||
"xpack.apm.metrics.durationByCountryMap.RegionMapChart.ToolTip.countPageLoads": "{docCount} 个页面加载",
|
||||
"xpack.apm.settings.agentConf.configTable.editButtonDescription": "编辑此配置",
|
||||
"xpack.apm.settings.agentConf.configTable.editButtonLabel": "编辑",
|
||||
"xpack.apm.settings.agentConf.configTable.emptyPromptText": "让我们改动一下!可以直接从 Kibana 微调代理配置,无需重新部署。首先创建您的第一个配置。",
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue