動態更改標簽以顯示y軸的最小值和最大值

Question

我想使用按鈕獲取y軸的最小值和最大值標簽。 當我選擇要顯示的其他圖表時，它應該更新標簽。 現在，如果我單擊獲取標簽按鈕，並且顯示正確的極值標簽，但是如果我繼續單擊范圍按鈕或輸入范圍框，它將不會自動更新標簽。 如何解決這個問題？ 謝謝這里是jsfiddle鏈接JS

html代碼：

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>
<button id="button">Get Y axis extremes</button>

我的js代碼：

$(function() {

    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
        // Create the chart
        $('#container').highcharts('StockChart', {


            rangeSelector : {
                selected : 1,
                inputEnabled: $('#container').width() > 480
            },

            title : {
                text : 'AAPL Stock Price'
            },

            series : [{
                name : 'AAPL',
                data : data,
                tooltip: {
                    valueDecimals: 2
                }
            }]
        });
        // the button action
    $('#button').click(function() {
        var chart = $('#container').highcharts(),
            extremes = chart.yAxis[0].getExtremes();

        chart.renderer.label(
            'dataMax: '+ extremes.dataMax +'<br/>'+
            'dataMin: '+ extremes.dataMin +'<br/>'+
            'max: '+ extremes.max +'<br/>'+
            'min: '+ extremes.min +'<br/>',
            100,
            100
        )
        .attr({
            fill: '#FCFFC5',
            zIndex: 8
        })
        .add();

        //$(this).attr('disabled', true);
    });
    });

});

Answer 1

使用圖表重繪事件 。

使標簽添加功能：

function addLabel(){
    var chart = $('#container').highcharts(),
            extremes = chart.yAxis[0].getExtremes();

        chart.renderer.label(
            'dataMax: '+ extremes.dataMax +'<br/>'+
            'dataMin: '+ extremes.dataMin +'<br/>'+
            'max: '+ extremes.max +'<br/>'+
            'min: '+ extremes.min +'<br/>',
            100,
            100
        )
        .attr({
            fill: '#FCFFC5',
            zIndex: 8,
            id :'myLabel'
        })
        .add();
}

然后，如果事件是先前添加的標簽，則對其進行更新：

        chart: {
             events: {
                 redraw: function() {
                     var oL = $('#myLabel');
                     if (oL.length){
                         oL.remove();
                         addLabel();
                     }
                 }
             }
         },

這是最新的小提琴 。