I. Overview
1.1 Problem description
When there are many components in the dashboard, the canvas will be large, making it difficult to quickly select the frequently-used components. It is hoped that you can jump to the designated components by clicking a button.
1.2 Solutions
By adding a JS click event to the button widget, when the button is clicked, you can jump to the specified component.
II. Example
2.1 Report design
1) Add three charts and a button widget to the dashboard, and the charts are bound to the data, as shown in the following figure:
2) Add Click event to button widget, as shown below:
The JS code is as follows:
var a=document.getElementsByClassName('fr-titlelayout ui-state-enabled')[2];
a.setAttribute('id','Chart1');
//If the id produced by the chart block is different every time it is refreshed,
//then you need to get the chart object first,
//and then set a fixed id for it before jumping
document.getElementById('Chart1').scrollIntoView();
//CHART1 is the id of the corresponding component
2.2 Effect preview
Save the report and preview. The effect is as shown in the figure below:
Note: Mobile terminal is not supported.
Previous：JS Hide Gantt chart grid line
