echarts柱状图多y轴
时间: 2023-11-10 22:02:58 浏览: 96
echarts漂亮的柱状图按月统计
在使用 echarts 制作柱状图时,可以通过设置多个 y 轴来实现多个数据系列的展示,具体操作如下:
1. 在 option 中添加 yAxis 数组,每个元素表示一个 y 轴,如下所示:
```javascript
option = {
...
yAxis: [
{type: 'value', name: '第一个 y 轴'},
{type: 'value', name: '第二个 y 轴'}
],
...
};
```
2. 在 series 中指定每个系列对应的 y 轴,使用 yAxisIndex 属性,如下所示:
```javascript
option = {
...
series: [
{
name: '系列一',
type: 'bar',
data: [1, 2, 3],
yAxisIndex: 0 // 指定该系列使用第一个 y 轴
},
{
name: '系列二',
type: 'bar',
data: [4, 5, 6],
yAxisIndex: 1 // 指定该系列使用第二个 y 轴
}
],
...
};
```
这样,就可以实现在同一个柱状图中展示多个数据系列,并且每个系列对应一个独立的 y 轴。
阅读全文