chartjs-plugin-zoom
chartjs-plugin-zoom copied to clipboard
Zoom can be trigger outside of chart region
Hi,
I am using [email protected]
and [email protected]
.
I found that it is possible to zoom outside of chart data region.
For example, I can zoom on legend / y-axis even if there is no data in this region.
See bellow screen capture:
I have following zoom plugin configuration:
zoom: {
pan: {
enabled: true,
mode: "x",
modifierKey: "ctrl",
},
zoom: {
drag: {
enabled: true,
},
mode: "x",
},
},
I can provide limits
configuration, which helps.
But it is still possible to highlight legend / y-axis and trigger zoom with unwanted data.
I did not find any related issue on this git repository or on stackoverflow.com.
Is there any way to prevent zooming outside of data region ?
EDIT:
Looking deeper at the library code, I may have found the root cause of this "bug".
In https://github.com/chartjs/chartjs-plugin-zoom/blob/bb6dee3df3abad91fb6199f7e349859de448e75c/src/handlers.js#L67-L83
Variables, left
/ right
/ top
/ bottom
are overridden if xEnabled
or / and yEnabled
.
Code should be:
if (xEnabled) {
left = Math.max(left, Math.min(beginPoint.clientX, endPoint.clientX) - offsetX);
right = Math.min(right, Math.max(beginPoint.clientX, endPoint.clientX) - offsetX);
}
if (yEnabled) {
top = Math.max(top, Math.min(beginPoint.clientY, endPoint.clientY) - offsetY);
bottom = Math.min(bottom, Math.max(beginPoint.clientY, endPoint.clientY) - offsetY);
}
Changing above lines fix the issue on local workspace. But I do not know if there is other impact changing this.
I can provide PR if anyone wants 😄
subscribing
I have the same issue, we can zoom outside of data, on yaxis and xaxis legend
To fix https://github.com/chartjs/chartjs-plugin-zoom/issues/256 "Zoom triggered when hiding/showing series by clicking legend", I have created PR https://github.com/chartjs/chartjs-plugin-zoom/pull/772 "Don't trigger the zoom on legends area".
So, it has currently been limited to prevent zoom starting only when mouseDown happens in legends area.
What do people (including @kurkle) think, should I change the implementation to actually check if mouseDown happens in chartArea?