Apache
/
druid
mirror of https://github.com/apache/druid.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

line chart fix others not mapping correctly (#14931)

This commit is contained in:
Vadim Ogievetsky 2023-08-30 15:59:26 -07:00 committed by GitHub
parent 42cfb999cd
commit 04a1153d0f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web-console/src/console-application.scss
View File

@ -37,7 +37,7 @@
} }
&.thinner { &.thinner {
padding: 5px; padding: 8px;
} }
.app-view { .app-view {

29
web-console/src/views/explore-view/modules/time-chart-echarts-module.ts
View File

@ -22,6 +22,9 @@ import * as echarts from 'echarts';
import { getInitQuery } from '../utils'; import { getInitQuery } from '../utils';
const TIME_NAME = '__t__';
const METRIC_NAME = '__met__';
const STACK_NAME = '__stack__';
const OTHERS_VALUE = 'Others'; const OTHERS_VALUE = 'Others';
function transformData(data: any[], vs: string[]): Record<string, number>[] { function transformData(data: any[], vs: string[]): Record<string, number>[] {
@ -31,12 +34,13 @@ function transformData(data: any[], vs: string[]): Record<string, number>[] {
let lastDatum: Record<string, number> | undefined; let lastDatum: Record<string, number> | undefined;
const ret = []; const ret = [];
for (const d of data) { for (const d of data) {
if (d.time.valueOf() !== lastTime) { const t = d[TIME_NAME];
if (t.valueOf() !== lastTime) {
if (lastDatum) ret.push(lastDatum); if (lastDatum) ret.push(lastDatum);
lastTime = d.time.valueOf(); lastTime = t.valueOf();
lastDatum = { ...zeroDatum, time: d.time }; lastDatum = { ...zeroDatum, [TIME_NAME]: t };
} }
lastDatum![d.stack] = d.met; lastDatum![d[STACK_NAME]] = d[METRIC_NAME];
} }
if (lastDatum) ret.push(lastDatum); if (lastDatum) ret.push(lastDatum);
return ret; return ret;
@ -78,7 +82,7 @@ export default typedVisualModule({
}, },
showOthers: { showOthers: {
type: 'boolean', type: 'boolean',
default: false, default: true,
control: { control: {
visible: ({ params }) => Boolean(params.splitColumn), visible: ({ params }) => Boolean(params.splitColumn),
}, },
@ -172,7 +176,7 @@ export default typedVisualModule({
table, table,
splitColumn && vs && !showOthers ? where.and(splitColumn.expression.in(vs)) : where, splitColumn && vs && !showOthers ? where.and(splitColumn.expression.in(vs)) : where,
) )
.addSelect(F.timeFloor(C('__time'), L(timeGranularity)).as('time'), { .addSelect(F.timeFloor(C('__time'), L(timeGranularity)).as(TIME_NAME), {
addToGroupBy: 'end', addToGroupBy: 'end',
addToOrderBy: 'end', addToOrderBy: 'end',
direction: 'ASC', direction: 'ASC',
@ -183,11 +187,11 @@ export default typedVisualModule({
(showOthers (showOthers
? SqlCase.ifThenElse(splitEx.in(vs!), splitEx, L(OTHERS_VALUE)) ? SqlCase.ifThenElse(splitEx.in(vs!), splitEx, L(OTHERS_VALUE))
: splitEx : splitEx
).as('stack'), ).as(STACK_NAME),
{ addToGroupBy: 'end' }, { addToGroupBy: 'end' },
); );
}) })
.addSelect(metric.expression.as('met')), .addSelect(metric.expression.as(METRIC_NAME)),
) )
).toObjectArray(); ).toObjectArray();
@ -220,7 +224,7 @@ export default typedVisualModule({
myChart.setOption( myChart.setOption(
{ {
dataset: { dataset: {
dimensions: ['time'].concat(vs || ['met']), dimensions: [TIME_NAME].concat(effectiveVs || [METRIC_NAME]),
source: sourceData, source: sourceData,
}, },
animation: false, animation: false,
@ -229,19 +233,20 @@ export default typedVisualModule({
data: effectiveVs, data: effectiveVs,
} }
: undefined, : undefined,
series: (effectiveVs || ['met']).map(v => { series: (effectiveVs || [METRIC_NAME]).map(v => {
return { return {
id: v, id: v,
name: effectiveVs ? v : metric.name, name: effectiveVs ? v : metric.name,
type: 'line', type: 'line',
stack: 'Total', stack: 'Total',
showSymbol, showSymbol,
areaStyle: {}, lineStyle: v === OTHERS_VALUE ? { color: '#ccc' } : {},
areaStyle: v === OTHERS_VALUE ? { color: '#ccc' } : {},
emphasis: { emphasis: {
focus: 'series', focus: 'series',
}, },
encode: { encode: {
x: 'time', x: TIME_NAME,
y: v, y: v,
itemId: v, itemId: v,
}, },