2017-11-25 24 views
0

我使用多個highChart在多個圖表的儀表盤頁面如linearea,花鍵,餡餅和同步HighCharts同步提示作用的其他圖

設置提示同步原型

Highcharts.Pointer.prototype.reset = function() { 
    return undefined; 
}; 

Highcharts.Point.prototype.highlight = function (event) { 
    this.onMouseOver(); // Show the hover marker 
    this.series.chart.tooltip.refresh(this); // Show the tooltip 
    this.series.chart.xAxis[0].drawCrosshair(event, this); // Show the crosshair 
}; 

但上述功能的影響所有的高圖例如linearea和樣條圖等等我想申請的同步只有

回答

0

參照這個現場演示:http://jsfiddle.net/kkulig/eec3mg9t/

我把每個圖表放到一個單獨的容器中 - 那麼操縱它們會更容易。 class="sync"指示圖表應該同步:

<div id="container0"></div> 
<div id="container1" class="sync"></div> 
<div id="container2" class="sync"></div> 

然後我使用此類設置常見事件:

$('.sync').bind('mousemove touchmove touchstart', function(e) { 
    (...) 

我施加包裹而不是重寫Highcharts.Pointer.prototype.reset功能,使得對不同步的默認動作的火災圖表。

// Custom wrap 
    Highcharts.wrap(Highcharts.Pointer.prototype, 'reset', function(proceed, allowMove, delay) { 
    if (!this.chart.options.chart.isSynchronized) { 
     proceed.apply(this, allowMove, delay); 
    } 
    }); 
+0

Highcharts包裝工作,當綁定重置原型火鼠標移動,但是當mouseleave高圖div甚至改變頁面,但仍然看着鼠標移動,你可以告訴我如何停止觀看鼠標移動 – fahad

相關問題