Open JonRaw5 opened 1 month ago
Note that the feature mentioned has been introduced in the version 11.1.0
of Highcharts (https://www.highcharts.com/blog/changelog/#highcharts-v11.1.0). The mouse wheel behavior is enabled by default for Highcharts Stock charts, and it is also available to the core chart types by importing the mouse-wheel-zoom
module.
As we currently use the 9.2.2
version, this option could be only introduced after we also update the HC dependency, which would require a new major.
The related API that controls the zooming behavior has been changed since the 9.2.2 version, so we need to address this API change as part of the upgrade:
chart: {
- pinchType: 'x',
- zoomType: 'x',
+ zooming: {
+ pinchType: 'x',
+ type: 'x'
+ },
animation: false,
width: 600
},
Therefore the Flow API should be changed accordingly:
var chart = new Chart();
var model = chart.getConfiguration().getChart();
// NEW API
var zooming = model.getZooming();
zooming.setType(Dimension.X);
zooming.setPinchType(Dimension.X);
Describe your motivation
The current implementation of zooming by dragging an area does not allow the user to zoom back out - only reset. If you have both zooming and panning enabled, when the user is trying to zoom to a specific point - any user error such as zooming again or in the wrong place cannot be corrected and therefore the user has to reset and start the process again.
Being able to scroll to zoom in / out makes this process more efficient for the user - especially with time series data.
Describe the solution you'd like
Have the mouse scroll option for zooming in charts - feature exists within Highcharts / Highstock (default) library already.
Example Demo From Highstock: https://www.highcharts.com/demo/stock/data-grouping
Describe alternatives you've considered
Currently working on a Java web app using Vaadin, have had to implement a scroll listener and have a client callable method that manually reduces / increases the xaxis extreme values - although this allows zooming using the scroll wheel it currently does not allow the user to zoom specifically to the pointer location on the chart. More complicated a solution than could be achieved and less robust - considering the functionality already exists in Highcharts
Additional context
No response