echarts axisPointer如何让Y轴的部分自动跟随点?
时间: 2023-07-05 13:04:39 浏览: 113
可以通过设置 `axisPointer` 的 `snap` 属性来实现 Y 轴部分自动跟随点的效果。
具体实现方法如下:
1. 设置 Y 轴的 `boundaryGap` 为 `false`,使得 Y 轴的数据区间与边界对齐。
```javascript
yAxis: {
type: 'value',
boundaryGap: false // 不留空隙
}
```
2. 设置 `axisPointer` 的 `snap` 属性为 `true`,使得 axisPointer 可以自动对齐到最近的数据点。
```javascript
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
snap: true // 自动对齐到最近的数据点
}
}
```
完整代码示例:
```javascript
option = {
xAxis: {
type: 'category',
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
},
yAxis: {
type: 'value',
boundaryGap: false // 不留空隙
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
snap: true // 自动对齐到最近的数据点
}
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line'
}]
};
```
这样,就可以实现 Y 轴部分自动跟随点的效果了。
阅读全文