I. Overview
1.1 Problem
In some scenarios, multiple carousel charts in a report need to be switched at the same time. The effect is shown in the figure below, how to achieve it?
1.2 Solution
Add a click event to the button, call the following interface through JS, and switch the carousel chart uniformly. After successful switching, the timers of all carousel charts will return to 0.
chart.unifiedSwitchCarouselChart(direction)
Note:
direction is an optional parameter, which indicates the direction of chart switching. A parameter of 1 means switching to the next chart, and a parameter of -1 means switching to the previous chart.
This method does not support mobile terminals.
II. Example
2.1 Report design
Add 2 chart blocks to the dashboard, and add multiple types of chart tabsto each chart. Bind the data source for them.
For the two chart blocks, the switching mode is selected as carousel, the carousel arrow is displayed, and the time interval is set to 5 seconds, as shown in the following figure:
2.2 Add click event
Add a button to the report, add a click event to it with the following JS:
VanCharts.unifiedSwitchCarouselChart(1);
2.3 Preview effect
After saving, click Preview. After clicking the button, you can see the two chart blocks switching at the same time:
