feat: 折线图支持堆叠模式

This commit is contained in:
zxc 2024-09-14 22:20:03 +08:00
parent 50f4f8f0e7
commit dcd9429c81
3 changed files with 20 additions and 15 deletions

View File

@ -413,6 +413,7 @@ export default () => {
break
case 'lineChart':
case 'line3DChart':
if (el.grouping === 'stacked' || el.grouping === 'percentStacked') options.stack = true
chartType = 'line'
break
case 'areaChart':

View File

@ -8,17 +8,17 @@
<template v-if="['bar', 'column', 'area', 'line'].includes(handleChartElement.chartType)">
<div class="row">
<Checkbox
@update:value="value => updateOptions({ stack: value })"
:value="stack"
style="flex: 2;"
>堆叠样式</Checkbox>
<Checkbox
v-if="handleChartElement.chartType === 'line'"
@update:value="value => updateOptions({ lineSmooth: value })"
:value="lineSmooth"
style="flex: 3;"
>使用平滑曲线</Checkbox>
<Checkbox
v-if="['bar', 'column', 'area'].includes(handleChartElement.chartType)"
@update:value="value => updateOptions({ stack: value })"
:value="stack"
style="flex: 1;"
>堆叠样式</Checkbox>
</div>
<Divider />

View File

@ -121,15 +121,19 @@ export const getChartOption = ({
yAxis: {
type: 'value',
},
series: data.series.map((item, index) => ({
data: item,
name: data.legends[index],
type: 'line',
smooth: lineSmooth,
label: {
show: true,
},
})),
series: data.series.map((item, index) => {
const seriesItem: echarts.SeriesOption = {
data: item,
name: data.legends[index],
type: 'line',
smooth: lineSmooth,
label: {
show: true,
},
}
if (stack) seriesItem.stack = 'A'
return seriesItem
}),
}
}
if(type === 'pie') {