0

ナビゲーター ハンドルの 1 つをドラッグすると、両方の日付が変更されます。

再現するには、http://jsfiddle.net/rNer2/5/に移動し、ナビゲーター ハンドルの 1 つをドラッグします。提供されたテスト ケースでは、問題はハンドルが最初にドラッグされたときにのみ発生します。実際には他の状況でも発生する可能性がありますが、ここで修正すると、他のケースでも修正される可能性があります。

以下の重複コードを参照してください。

<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