Description
Panning in chartJS v3.7.1 and and chartJS-plugin-zoom v.1.2.1 doesn't work at all, though zooming does. I have read through many forums and stack overflow pages, but here I am now.
So first I had an issue with my cdn and hammerJS. Now fixed. My scripts in my head tag look like this:
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/1.2.1/chartjs-plugin-zoom.min.js"> </script><script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js"></script>
My chart-setup-block looks like this:
var cpuchartelement = new Chart(ctx, { type: 'line', data: { labels: labels, datasets: [{ label: "CPU usage", data: values, fill: false, borderColor: "#bae755", borderWidth : 0.7, backgroundColor: "#bae755", tension: 0, pointRadius: 1, pointHitRadius: 30 }], }, options: { pan: { enabled: true, mode: 'x', }, plugins: { zoom: { pan:{ enabled: true, mode: "x" }, zoom: { wheel: { enabled: true, }, pinch: { enabled: true }, mode: 'xy' }, limits: { y: {min: 0, max: 100}, } } }, animation: true, responsive: true, scales: { y: { beginAtZero: true, min: 0, max: 100 } } } })
Animations, pointRadius and everything else works just fine, but panning is bugged. I tried left clicking, I tried right clicking, I tried holding alt, cmd, even fn, shift etc.
WHY JUST WHY DOESNT IT WORK.
Ok, Thanks for any advice.