2016-07-08 64 views
0

我想要控制只使用導航器啓用x軸縮放的高架圖上的縮放按鈕的可見性。高點重置縮放按鈕

默認情況下,該組合顯示核心代碼禁用縮放按鈕。但是有一些功能可以讓你顯示按鈕,但我找不到一個隱藏它。

function createChart() { 
    $('#container').highcharts('StockChart', { 
     chart: { 
      zoomType: "x", 
      panning: true, 
      panKey: "shift" 
     }, 
     rangeSelector: { 
      selected: 4 
     }, 
     xAxis: { 
      events: { 
       setExtremes: xAxisExtremes 
      }, 
     }, 
     yAxis: { 
      labels: { 
       formatter: function() { 
        return (this.value > 0 ? ' + ' : '') + this.value + '%'; 
       } 
      }, 
      plotLines: [{ 
       value: 0, 
       width: 2, 
       color: 'silver' 
      }] 
     }, 
     series: seriesOptions 
    }); 
} 

function xAxisExtremes(e) { 
    var chart = $('#container').highcharts(); 

    if (e.trigger === "zoom") { 
     if (e.min && e.max) { 
      chart.showResetZoom(); 
     } else { 
      alert("Reset Zoom"); 
      // chart.hideResetZoom(); ???? 
     } 
    } 
} 

看到這個小提琴的例子與我一起工作。 https://jsfiddle.net/sooftcL7/3/

點擊進入xAxis setExtremes事件允許我使用觸發器標識符來檢測出現的縮放事件。我可以使用chart.showResetZoom();

我都試過

chart.resetZoomButton.destroy() 
chart.resetZoomButton.hide() 

其他地方的建議,但他們都沒有定義的功能。

任何幫助,將不勝感激。

乾杯,

D.

+0

您可以更改標準Highstock Axis.prototype.zoom函數,以添加顯示和隱藏縮放按鈕的功能。在這裏你可以找到一個例子它如何工作:https://jsfiddle.net/sooftcL7/4/ –

回答

1

您必須禁用導航去除底欄並禁用rangeSelector去除變焦按鈕

$('#container').highcharts('StockChart', { 
    ... 
    rangeSelector : { 
     enabled: false 
    }, 
    navigator: { 
     enabled: false 
    } 
    ... 
}); 

檢查這個 http://jsfiddle.net/CgAnW/

+1

謝謝zoro, 我知道,禁用導航器將啓用縮放按鈕的默認設置。不過,我特別需要導航儀。 我想發現的是,如果有隱藏縮放按鈕的方法就像顯示它。 乾杯, D. – Dave

0

只有當resetZoomButton是一個對象時,纔可以調用resetZoomButton.destroy()函數。根據Highsotck來源:

對於股票圖表(...)X軸縮放已被導航器和範圍選擇器允許。

if (zoomType === 'x') { 
     chart.resetZoomButton = 'blocked'; // replaced with string 
    } 

因此,要破解這個你可以簡單地做:

chart: { 
     zoomType: 'xz' // whatever string containg x 
    } 

這意味着變焦類型保持「X」,但你忽略這個醜陋的if語句它取代resetZoomButton對象與一些隨機字符串...