highcharts包裝功能'拖'

我想寫一個'拖'的包裝功能，以便當我點擊鼠標並拖動鼠標時，我可以得到xAxis上選定區域的最小/最大值。當我嘗試以下時，我可以看到e是一個MouseEvent，但是，我無法看到e.min和e.max（它們是未定義的）。highcharts包裝功能'拖'

Highcharts.wrap(Highcharts.Pointer.prototype, "drag", function(p, e) { 
     console.log('drag started'); 
     console.log(e); 
     console.log(e.min, e.max); 
     p.call(this, e); 
    });

有誰知道有沒有辦法讓xAxis上的選定區域的邊界？

非常感謝！

來源

2015-10-05 Guifan Li

沒有它解決您的問題http://stackoverflow.com/questions/32528010/highchart-select -an-area-to-show-some-info-by-clicking-and-drag-mouse-but-not-re –

@NishithChaturvedi不是，你所描述的那個是關於在圖表上拖動數據點的，但是，我的問題是要獲得變焦在釋放鼠標之前在圖表上選擇的區域。它更類似於這個http://jsfiddle.net/highcharts/K7pN9/。當你點擊鼠標並拖動時，你會看到一個可以放大的區域，但是我想在釋放之前獲得所需的數據。 –

你可以這樣說：

JSFiddle link

var axisMin = -1, axisMax = -1; 
 

 
$(function() { 
 
    Highcharts.wrap(Highcharts.Pointer.prototype, "dragStart", function(p, e) { 
 
     console.log('drag started'); 
 
     p.apply(this, Array.prototype.slice.call(arguments, 1)); 
 
     // the dragStart function sets this.mouseDownX for you 
 
     // documentation for Axis#toValue() function is here: 
 
     // http://api.highcharts.com/highcharts#Axis.toValue 
 
     axisMin = this.chart.xAxis[0].toValue(this.mouseDownX, 0); 
 
    }); 
 

 
    Highcharts.wrap(Highcharts.Pointer.prototype, "drag", function(p, e) { 
 
     // e.chartX represents the pixel position of the mouse pointer in the chart 
 
     axisMax = this.chart.xAxis[0].toValue(e.chartX, 0); 
 
     console.log('' + new Date(axisMin) + ' to ' + new Date(axisMax)); 
 
     p.apply(this, Array.prototype.slice.call(arguments, 1)); 
 
    }); 
 

 
    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function (data) { 
 

 
     $('#container').highcharts({ 
 
      chart: { 
 
       zoomType: 'x' 
 
      }, 
 
      xAxis: { 
 
       type: 'datetime' 
 
      }, 
 
      series: [{ 
 
       data: data 
 
      }] 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="http://code.highcharts.com/highcharts.src.js"></script> 
 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 
 

 
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

來源

2015-10-06 07:01:00

非常感謝，這正是我正在尋找的。爲此非常感謝。 –

嗨Vicky，只是想知道有一種方法來獲取工具提示的日期值在'拖'包裝函數？我問這個問題的原因是，有時axisMax需要四捨五入以與工具提示上的日期顯示一致。有時舍入結果是不同的。例如，如果我將鼠標拖到星期五和星期一之間的某個地方，axisMax將在某個時間星期六。 –

是的，我也注意到了，我不確定是什麼原因導致了錯誤。但是你可以在這裏查看'Highcharts.Pointer'源代碼，看看它是否有幫助：https：//github.com/highslide-software/highcharts.com/blob/master/js/parts/Pointer.js#L342 –

highcharts包裝功能'拖'

回答

相關問題