Question

我有HighStock费用，滚动条与此非常相似

http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/stock/demo/navigator-disabled/

    Highcharts.stockChart('container', {


        rangeSelector: {
            selected: 1
        },

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

        navigator: {
            enabled: false
        },

        series: [{
            name: 'AAPL Stock Price',
            data: data,
            tooltip: {
                valueDecimals: 2
            }
        }]
    });

我希望默认滚动位置位于图表中间的某个位置，有没有办法做到这一点？

Answer 1

您可以在xAxis.setExtremes来电时使用chart.events.load执行此操作。一个简单的例子（使用任意1年范围）：

  chart: {
    events: {
      load: function() {
        this.xAxis[0].setExtremes(
          Date.UTC(2013, 0, 1),
          Date.UTC(2013, 11, 31)
        );
      }
    }
  },

示例jsFiddle。

如果您需要确定“中间”是什么，它可能取决于您可以预先计算它的数据源，或者您也可以在chart.events.load电话上执行此操作。

为了好玩，我添加了中点计算。这使用了moment.js，因为它比滚动你自己的时间方法容易得多。

minX = data[0][0];
maxX = data[data.length - 1][0];
midX = minX + ((maxX - minX) / 2);

var midDate = new Date(midX);
var startDate = moment(midDate);
var endDateMoment = moment(midDate);
startDate.subtract(1.5, 'months');
endDateMoment.add(1.5, 'months');

请注意，我加上/减去1.5个月，以使您的3个月范围选择器有效。 moment.js库最多可以使用2个月。你明白了。因此，setExtremes变为：

    this.xAxis[0].setExtremes(
      startDate.valueOf(), //.valueOf() in this context converts to javascript time
      endDateMoment.valueOf()
    );

这是现场jsFiddle。

Highcharts / Highstock滚动默认位置

1 个答案: