Display ECharts toolbox whenever zoom and scroll is enabled on a chart

Problem

Screenshot A	Screenshot B

If you take a look at screenshot A, the gray area chart inside the zoom slider doesn't seem to match the data in the actual chart. This could be happening due to a number of reasons:

1. decimal places of actual data vs rendered (though unlikely to be the root cause)
2. scale of the Y axis is so big such that the variance in values isn't as obvious in the actual chart
3. Zoom chart slider doesn't show the threshold data, as a result the Y axis of the chart slider has more room to show variance of data values/

If you take a look at screenshot B, the gray area chart inside the zoom slider seems to match the data correctly.

Some questions to ponder:

• Is this a gitlab-ce~2278648 we should be fixing? In the very least, it seems like it may confuse users. What would a fix look like? Should we consider also adding the threshold or specifying the Y-axis for the zoom chart scroll slider?
• Would adding a vertical zoom slider (available in ECharts) help alleviate this problem? Would it be too much visual noise for our charts?

Solution

1. Add toolbox and zoom and scroll as a chart story on gitlab-ui
2. Always include ECharts toolbox when zoom and scroll is enabled on a chart