forked from github/dataease
Merge pull request #6361 from dataease/pr@dev-v2@fix_line_sub_dimension
fix: 折线图存在子维度时提示类别显示错误
This commit is contained in:
commit
45e7f2395a
@ -49,7 +49,7 @@ const switchValue = computed({
|
|||||||
:effect="themes"
|
:effect="themes"
|
||||||
size="small"
|
size="small"
|
||||||
v-model="switchValue"
|
v-model="switchValue"
|
||||||
@click.stop="e => onSwitchChange(e)"
|
@click.stop="onSwitchChange"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -5,7 +5,7 @@ import {
|
|||||||
import { Line as G2Line, LineOptions } from '@antv/g2plot/esm/plots/line'
|
import { Line as G2Line, LineOptions } from '@antv/g2plot/esm/plots/line'
|
||||||
import { getPadding } from '../../common/common_antv'
|
import { getPadding } from '../../common/common_antv'
|
||||||
import { flow, hexColorToRGBA, parseJson } from '@/views/chart/components/js/util'
|
import { flow, hexColorToRGBA, parseJson } from '@/views/chart/components/js/util'
|
||||||
import { cloneDeep } from 'lodash-es'
|
import { cloneDeep, isEmpty } from 'lodash-es'
|
||||||
import { valueFormatter } from '@/views/chart/components/js/formatter'
|
import { valueFormatter } from '@/views/chart/components/js/formatter'
|
||||||
import {
|
import {
|
||||||
LINE_AXIS_TYPE,
|
LINE_AXIS_TYPE,
|
||||||
@ -214,11 +214,67 @@ export class Line extends G2PlotChartView<LineOptions, G2Line> {
|
|||||||
return tmpOptions
|
return tmpOptions
|
||||||
}
|
}
|
||||||
|
|
||||||
|
protected configTooltip(chart: Chart, options: LineOptions): LineOptions {
|
||||||
|
const customAttr: DeepPartial<ChartAttr> = parseJson(chart.customAttr)
|
||||||
|
const tooltipAttr = customAttr.tooltip
|
||||||
|
if (!tooltipAttr.show) {
|
||||||
|
return {
|
||||||
|
...options,
|
||||||
|
tooltip: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const xAxisExt = chart.xAxisExt
|
||||||
|
const formatterMap = tooltipAttr.seriesTooltipFormatter
|
||||||
|
?.filter(i => i.show)
|
||||||
|
.reduce((pre, next) => {
|
||||||
|
pre[next.id] = next
|
||||||
|
return pre
|
||||||
|
}, {}) as Record<string, SeriesFormatter>
|
||||||
|
const tooltip: LineOptions['tooltip'] = {
|
||||||
|
showTitle: true,
|
||||||
|
customItems(originalItems) {
|
||||||
|
if (!tooltipAttr.seriesTooltipFormatter?.length) {
|
||||||
|
return originalItems
|
||||||
|
}
|
||||||
|
const head = originalItems[0]
|
||||||
|
// 非原始数据
|
||||||
|
if (!head.data.quotaList) {
|
||||||
|
return originalItems
|
||||||
|
}
|
||||||
|
const result = []
|
||||||
|
originalItems
|
||||||
|
.filter(item => formatterMap[item.data.quotaList[0].id])
|
||||||
|
.forEach(item => {
|
||||||
|
const formatter = formatterMap[item.data.quotaList[0].id]
|
||||||
|
const value = valueFormatter(parseFloat(item.value as string), formatter.formatterCfg)
|
||||||
|
let name = isEmpty(formatter.chartShowName) ? formatter.name : formatter.chartShowName
|
||||||
|
if (xAxisExt?.length > 0) {
|
||||||
|
name = item.data.category
|
||||||
|
}
|
||||||
|
result.push({ ...item, name, value })
|
||||||
|
})
|
||||||
|
head.data.dynamicTooltipValue?.forEach(item => {
|
||||||
|
const formatter = formatterMap[item.fieldId]
|
||||||
|
if (formatter) {
|
||||||
|
const value = valueFormatter(parseFloat(item.value), formatter.formatterCfg)
|
||||||
|
const name = isEmpty(formatter.chartShowName) ? formatter.name : formatter.chartShowName
|
||||||
|
result.push({ color: 'grey', name, value })
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
...options,
|
||||||
|
tooltip
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
protected setupOptions(chart: Chart, options: LineOptions): LineOptions {
|
protected setupOptions(chart: Chart, options: LineOptions): LineOptions {
|
||||||
return flow(
|
return flow(
|
||||||
this.configTheme,
|
this.configTheme,
|
||||||
this.configLabel,
|
this.configLabel,
|
||||||
this.configMultiSeriesTooltip,
|
this.configTooltip,
|
||||||
this.configBasicStyle,
|
this.configBasicStyle,
|
||||||
this.configCustomColors,
|
this.configCustomColors,
|
||||||
this.configLegend,
|
this.configLegend,
|
||||||
|
Loading…
Reference in New Issue
Block a user