很多时候我们在渲染双Y轴的echarts折线图时,往往会出现这样的情况:
两边的刻度线对不齐,很影响美观,杂乱无章,在此我们将折线图稍作几个调整。
第一步:设置Y轴最大最小值,上下取整展示,使折线图起伏更加明显。
let maxY = Math.ceil(Math.max(...list) / 10) * 10; let minY = Math.floor(Math.min(...list) / 10) * 10;
复制
第二步:我们根据在yAxis中设置splitNumber与interval,来固定刻度线条数与步长。
splitNumber: 5, interval: (maxY - minY) / 5,
复制
最终效果: