echarts折线图Y轴2边都有刻度
时间: 2023-07-26 13:32:46 浏览: 72
您好,如果您想在 echarts 折线图中同时显示 y 轴左右两侧的刻度,可以设置 yAxis 中的 splitLine 和 axisLine 属性,并添加两个 yAxis。以下是示例代码:
```js
option = {
yAxis: [
{
type: 'value',
position: 'left',
axisLine: {
show: true // 显示左侧 y 轴线条
},
splitLine: {
show: true // 显示左侧 y 轴刻度线
}
},
{
type: 'value',
position: 'right',
axisLine: {
show: true // 显示右侧 y 轴线条
},
splitLine: {
show: true // 显示右侧 y 轴刻度线
}
}
],
series: [
{
name: '数据1',
type: 'line',
yAxisIndex: 0, // 对应左侧 y 轴
data: [10, 20, 30, 40, 50]
},
{
name: '数据2',
type: 'line',
yAxisIndex: 1, // 对应右侧 y 轴
data: [100, 200, 300, 400, 500]
}
]
};
```
在这个例子中,我们使用了两个 yAxis,一个是左侧的 y 轴,另一个是右侧的 y 轴,并在每个 yAxis 中设置了 axisLine 和 splitLine 属性,以显示 y 轴线条和刻度线。同时,我们在 series 数据项中通过 yAxisIndex 属性来指定对应的 y 轴。希望对您有所帮助!