How to achieve the linkage effect in the vchart library?

Question title

How to achieve the linkage effect of displaying the position of other charts when the mouse is moved in the vchart library?

Problem description

I encountered a problem when using the vchart library. I hope that when I move the mouse, other charts can also display their corresponding positions at the same time, that is, to achieve the linkage effect. I am not sure how to implement this function. Is there any relevant documentation for my reference?

Solution

This linkage effect can indeed be achieved. You need to listen to the dimensionHover event of a chart and then simulate dimensionHover for other charts.

First, you need to use the on method to listen to the dimensionHover event of the chart. The detailed API usage can be referred to the vchart API .

vChart.on('dimensionHover', function(params) {
// 处理逻辑
});
Then, you can use the setDimensionIndex method to simulate the dimensionHover effect on other charts. Please refer to the vchart API for API details.

vChart.setDimensionIndex(value, {
// options
});
Among them,

Value is the dimension value,
Options is a DimensionIndexOption type of parameter that can be used to filter the axis to trigger the dimension effect, configure tooltips and crosshairs, etc.