Highcharts panning

Question

I am trying to implement panning charts based on this example: http://jsfiddle.net/HXUmK/5/

But I want to be able to scale using the left mouse button and pan with the right mouse button. Therefore, I changed the code above and managed to make it work a little, but when I hold the right mouse button, the diagrams are also zombified.

Is there a way to disable the right mouse button for zooming in tall charts?

Edit: Sorry for not understanding this very much. The code in jsfiddle is not my code. Forget this code, this is just an example of the form I started with. I am trying to modify this code to get the left zoom button and the right pan button. Thus, I turned off the zoom in the mousetrap and activated the height of the screen.

Edit2: Here is my code: http://jsfiddle.net/TKPQN/

Answer 1

I wanted to use the shift key to scale, so this is my solution

$('#container').highcharts('StockChart', { chart: { //zoomType: 'x', // we declare it without zoom, so the pan is enabled // ... }}); var chart = $('#container').highcharts(); chart.pointer.cmd = chart.pointer.onContainerMouseDown; chart.pointer.onContainerMouseDown = function (a){ //in my case, I need only X zooming, so I enable it if shift is pressed this.zoomX=this.zoomHor=this.hasZoom=a.shiftKey; this.cmd(a); }; 

seems to be working fine so hopefully it helps you

here is a working JSFiddle example: http://jsfiddle.net/73bc23zq/

Answer 2

You can try with a selection event:

 chart: { ... events:{ selection: function(event) { if (lastButton == 1) event.preventDefault(); } } } 

See http://jsfiddle.net/TKPQN/48/