通過手機移動到三維圖表Highcharts？

Question

我在這個圖表的工作： http://www.highcharts.com/demo/3d-scatter-draggable

但我已經注意到，與移動（手機或平板電腦）是寸步難行（與thouch）的圖表。

我也用這樣的：

tooltip: {   
    followTouchMove: true 
} 

也許是不可能與所有手機或我的iPhone（Safari瀏覽器）不支持這個選項？

Answer 1

問題在於規範化，因此您需要修改指向pageX/pageY位置的行。

$(chart.container).bind('mousedown.hc touchstart.hc', function (e) { 
    e = chart.pointer.normalize(e); 

    var originalEvent = e.originalEvent || e, 
     posX = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageX : e.pageX, 
     posY = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageY : e.pageY, 
     alpha = chart.options.chart.options3d.alpha, 
     beta = chart.options.chart.options3d.beta, 
     newAlpha, 
     newBeta, 
     sensitivity = 5; // lower is more sensitive 

    $(document).bind({ 
     'mousemove.hc touchmove.hc': function (e) { 
      // Run beta 
      var originalEvent = e.originalEvent || e, 
       pageX = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageX : e.pageX, 
       pageY = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageY : e.pageY; 


      newBeta = beta + (posX - pageX)/sensitivity; 
      newBeta = Math.min(100, Math.max(-100, newBeta)); 
      chart.options.chart.options3d.beta = newBeta; 

      // Run alpha 
      newAlpha = alpha + (pageY - posY)/sensitivity; 
      newAlpha = Math.min(100, Math.max(-100, newAlpha)); 
      chart.options.chart.options3d.alpha = newAlpha; 

      chart.redraw(false); 
     }, 
      'mouseup touchend': function() { 
      $(document).unbind('.hc'); 
     } 
    }); 
}); 

例子：Android版Chrome上http://jsfiddle.net/L8o0pt6j/7/