diff --git a/src/views/components/chartsComponents/OperatingTrendsChart.vue b/src/views/components/chartsComponents/OperatingTrendsChart.vue index f1935ed..2a6613d 100644 --- a/src/views/components/chartsComponents/OperatingTrendsChart.vue +++ b/src/views/components/chartsComponents/OperatingTrendsChart.vue @@ -233,6 +233,19 @@ function svgToPercentEncodedDataUrl(svg: string) { // 初始化图例图标 initLegendIcons(); + // 计算y轴最大值 + const calculateMaxValue = () => { + let maxValue = 0; + chartData.value.seriesData.forEach(series => { + const seriesMax = Math.max(...series.data); + maxValue = Math.max(maxValue, seriesMax); + }); + // 将最大值向上取整到最接近的100的倍数 + return Math.ceil(maxValue / 100) * 100; + }; + + const maxYValue = calculateMaxValue(); + // 按钮的SVG背景 - 使用Base64编码 const buttonSvgBase64 = encodeURIComponent(` @@ -431,8 +444,8 @@ function svgToPercentEncodedDataUrl(svg: string) { }, type: "value", min: 0, - max: 500, - interval: 100, + max: maxYValue, + interval: Math.ceil(maxYValue / 5), axisLabel: { color: "#C0EEFF", fontSize: 14, @@ -457,10 +470,9 @@ function svgToPercentEncodedDataUrl(svg: string) { { type: "bar", id: "axisOverlayBar", - // zlevel: 1, silent: false, barWidth: "100%", - data: chartData.value.dates.map(() => 500), // 使用y轴的最大值 + data: chartData.value.dates.map(() => maxYValue), itemStyle: { color: "transparent", }, @@ -501,11 +513,10 @@ function svgToPercentEncodedDataUrl(svg: string) { type: "bar", barWidth: 40, barGap: "-100%", - // zlevel: 10, silent: true, animation: true, data: chartData.value.dates.map((_: any, index: number) => { - return index === dataIndex ? 500 : "-"; + return index === dataIndex ? maxYValue : "-"; }), itemStyle: { color: {