echarts: Linking charts
Motivation
I need to link two different charts at work. The motivation is that one chart is showing the data and the other one just quickly shows where you can find a peak. The chart on the top is going to be of type 'line` and the chart at the bottom is going to be of type 'bar'.
Requirements
Both charts have to be synchronized to each other in order to show peaks aligned with data above and also to keep it proportional when using the zoom feature in the upper chart.
For the chart showing the hot areas I could have used oneof type
line, and then showing the area created by those lines. The problem
is that at the moment you can’t register a click event on the area,
and I needed to allow the user to click over the area to show more
information.
|
Summary:
-
To see a guiding line to see where the cursor is in both charts
-
To be able to register a click event on the chart below
-
Keep line chart points aligned with the bars below
-
Keep proportionality in the bar chart when zooming in the line chart