Open antoniolopezmc opened 2 hours ago
Users should be able to select a range in the column bar, but not zooming the chart.
Users can select a range in the column bar (which is correct), but they also can zooming the chart with the mouse scroll button.
Now, I am using the version 2.52 of the library, in which the zooming with the mouse scroll button is not implemented.
After using the mouse scroll button inside the chart, the second image should not be zoomed.
JAVASCRIPT CODE
var options = { chart: { type: "bar", toolbar: { show: true, tools: { download: true, selection: true, zoom: false, zoomin: false, zoomout: false, pan: false, reset: false, customIcons: [] } }, selection: { enabled: true, type: 'x', xaxis: { min: 0, max: 100, } }, zoom: { enabled: false } }, series: [{ name: "count", data: [ [0, 50], [1, 48], [10, 99], [50, 75], [100, 87] ] }], xaxix: { type: 'numeric' }, }; var chart = new ApexCharts(document.querySelector("#chart"), options); chart.render();
CSS CODE
#chart { max-width: 650px; margin: 35px auto; }
HTML CODE
<div id="chart"> </div>
Please provide the require reproduction codepen link. Code snippets do not count.
https://codepen.io/antoniolopezmc/pen/yLmYGoV
Here is the fork :)
Description
Steps to Reproduce
Expected Behavior
Users should be able to select a range in the column bar, but not zooming the chart.
Actual Behavior
Users can select a range in the column bar (which is correct), but they also can zooming the chart with the mouse scroll button.
Now, I am using the version 2.52 of the library, in which the zooming with the mouse scroll button is not implemented.
Screenshots
After using the mouse scroll button inside the chart, the second image should not be zoomed.
Reproduction Link
JAVASCRIPT CODE
CSS CODE
HTML CODE