ECharts 入门教程 ECharts中y轴怎么反向与留白

2024-02-25 开发教程 ECharts 入门教程 匿名 7

使用 ECharts 时同样也要注意所设置的 y 轴是否是个反向轴,这通过 yAxis.inverse 就可以得知;并且还需要适当的给坐标轴做留白处理,这样会方便之后的一些操作,但是对于类目型与非类目型的坐标轴,有不同的留白策略。

yAxis.inverse | boolean

[ default: false ]

可以得出 y 轴是否是反向坐标轴。

该属性是 ECharts 3 中新加的。

yAxis.boundaryGap | boolean, Array

设置 y 坐标轴两边留白策略,类目轴和非类目轴的设置和表现不一样。(yAxis 通常并默认为数值型)

类目轴中 boundaryGap 可以配置为 true 和 false。默认为 true,这时候刻度只是作为分隔线,标签和数据点都会在两个刻度之间的带(band)中间。

非类目轴,包括时间,数值,对数轴,boundaryGap是一个两个值的数组,分别表示数据最小值和最大值的延伸范围,可以直接设置数值或者相对的百分比,在设置 min 和 max 后无效。 示例:

boundaryGap: ['20%', '20%']