feat(dashboard): 优化风险趋势图Y轴动态缩放逻辑
根据数据范围自动计算合适的Y轴最大值和刻度间隔: - 小于等于10:向上取整到整数 - 10-50:向上取整到10的倍数 - 50-100:向上取整到10的倍数 - 100-500:向上取整到50的倍数 - 500-1000:向上取整到100的倍数 - 大于1000:向上取整到500的倍数 自动计算刻度间隔,确保显示6-8个刻度,提升图表可读性
This commit is contained in:
parent
33cc05cb00
commit
230021a7b6
@ -281,7 +281,32 @@ const riskTrendOptions = computed<EChartsOption>(() => {
|
||||
// 计算最大值用于设置Y轴范围
|
||||
const allValues = [...highRiskData, ...warningData, ...normalData]
|
||||
const maxValue = Math.max(...allValues, 10)
|
||||
const yAxisMax = Math.ceil(maxValue / 50) * 50 + 50
|
||||
|
||||
// 动态计算Y轴最大值,根据数据范围自动向上取整到合适的量级
|
||||
let yAxisMax: number
|
||||
if (maxValue === 0) {
|
||||
yAxisMax = 10
|
||||
} else if (maxValue <= 10) {
|
||||
yAxisMax = Math.ceil(maxValue)
|
||||
} else if (maxValue <= 50) {
|
||||
// 对于10-50的数据,向上取整到10的倍数
|
||||
yAxisMax = Math.ceil(maxValue / 10) * 10
|
||||
} else if (maxValue <= 100) {
|
||||
// 对于50-100的数据,向上取整到10的倍数
|
||||
yAxisMax = Math.ceil(maxValue / 10) * 10
|
||||
} else if (maxValue <= 500) {
|
||||
// 对于100-500的数据,向上取整到50的倍数
|
||||
yAxisMax = Math.ceil(maxValue / 50) * 50
|
||||
} else if (maxValue <= 1000) {
|
||||
// 对于500-1000的数据,向上取整到100的倍数
|
||||
yAxisMax = Math.ceil(maxValue / 100) * 100
|
||||
} else {
|
||||
// 对于大于1000的数据,向上取整到500的倍数
|
||||
yAxisMax = Math.ceil(maxValue / 500) * 500
|
||||
}
|
||||
|
||||
// 计算合适的刻度间隔,确保显示6-8个刻度
|
||||
const interval = Math.max(Math.ceil(yAxisMax / 6), 1)
|
||||
|
||||
return {
|
||||
tooltip: {
|
||||
@ -306,7 +331,7 @@ const riskTrendOptions = computed<EChartsOption>(() => {
|
||||
type: 'value',
|
||||
min: 0,
|
||||
max: yAxisMax,
|
||||
interval: Math.ceil(yAxisMax / 6)
|
||||
interval: interval
|
||||
},
|
||||
series: [
|
||||
{
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user