0

When dragging one of the navigator handles, both dates change.

To reproduce, go to http://jsfiddle.net/rNer2/5/ and drag one of the navigator handles. In the provided test case, the problem only occurs the first time a handle is dragged. It can actually also happen in other situations, but perhaps fixing it here will fix it for the other cases as well.

See duplicate code below:

<div id="container" style="height: 400px; min-width: 600px"></div>  
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<div id="mindate" style="position:absolute;top:40px;left:0px;margin-left:20px;"></div>
<div id="maxdate" style="position:absolute;top:40px;right:0px;margin-right:50px;">

$(function() {
  var data = [];

  for (var i = 1971; i < 2020; ++i) {
      data.push([Date.UTC(i, 0, 1), 1]);
  }

  var chart = new Highcharts.StockChart({
        chart: {
            renderTo: 'container',
            type: 'column',
            events: {
                load: function() {
                    displayDates(this.xAxis[0].getExtremes());
                }
            }
        },
        xAxis: {
            ordinal: false,
            events: {
                afterSetExtremes: function(e) {
                    displayDates(e);
                }
            },
            min: Date.UTC(1984, 0, 1),
            max: Date.UTC(1988, 0, 1)
        },
        series: [{
            data: data
        }]
    });                    
});

function displayDates(e) {
    $('#mindate').html(Highcharts.dateFormat('%m/%d/%y %I:%M:%S%p', e.min));
    $('#maxdate').html(Highcharts.dateFormat('%m/%d/%y %I:%M:%S%p', e.max));    
}
4

1 回答 1

0

请熟悉非常简单的例子:

http://jsfiddle.net/ebLTE/

    $('#container').highcharts('StockChart', {
        chart:{
            type:'column'
        },

        rangeSelector : {
            selected : 1
        },

        title : {
            text : 'AAPL Stock Price'
        },
        xAxis:{
            min:1172707200000,
            max:1175126400000
        },

        series : [{
            name : 'AAPL',
            data : data,
            tooltip: {
                valueDecimals: 2
            }
        }]
    });
于 2013-04-11T13:01:35.713 回答