如何识别 Highcharts 数据组事件?

How to identify Highcharts datagroup event?

我想在 Highcharts 对数据进行分组时触发消息。我想显示的消息是,这是组数据,而不是真实数据。

我找到了一些禁用分组的信息:

dataGrouping: {enabled:false}

但我想找到一个在数据自动分组时触发的事件,它可以触发消息。

我怎样才能做到这一点?

$.getJSON('https://cdn.rawgit.com/highcharts/highcharts/057b672172ccc6c08fe7dbb27fc17ebca3f5b770/samples/data/large-dataset.json', function(data) {

  // Create a timer
  var start = +new Date();

  // Create the chart
  Highcharts.stockChart('container', {
    chart: {
      events: {
        load: function() {
          if (!window.TestController) {
            this.setTitle(null, {
              text: 'Built chart in ' + (new Date() - start) + 'ms'
            });
          }
        }
      },
      zoomType: 'x'
    },

    rangeSelector: {

      buttons: [{
        type: 'day',
        count: 3,
        text: '3d'
      }, {
        type: 'week',
        count: 1,
        text: '1w'
      }, {
        type: 'month',
        count: 1,
        text: '1m'
      }, {
        type: 'month',
        count: 6,
        text: '6m'
      }, {
        type: 'year',
        count: 1,
        text: '1y'
      }, {
        type: 'all',
        text: 'All'
      }],
      selected: 3
    },

    yAxis: {
      title: {
        text: 'Temperature (°C)'
      }
    },

    title: {
      text: 'Hourly temperatures in Vik i Sogn, Norway, 2009-2017'
    },

    subtitle: {
      text: 'Built chart in ...' // dummy text to reserve space for dynamic subtitle
    },

    series: [{
      name: 'Temperature',
      data: data.data,
      pointStart: data.pointStart,
      pointInterval: data.pointInterval,
      tooltip: {
        valueDecimals: 1,
        valueSuffix: '°C'
      }
    }]

  });
});
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>

View on JSFiddle

可以通过在generatePoints函数时检查hasGroupedData标志的状态来完成。 hasGroupedDatagenearatePoints 都属于一个 Series 对象。 Highcharts.wrap函数使代码简单:

 (function(H) {
   H.wrap(H.Series.prototype, 'generatePoints', function(proceed) {
     proceed.call(this);
     console.log('Data grouping applied: ' + (this.hasGroupedData === true));
   });
 })(Highcharts);

现场演示: http://jsfiddle.net/BlackLabel/djvrew2h/

注释掉 forced: true 以检查未应用分组时功能如何工作。

关于包装的文档: https://www.highcharts.com/docs/extending-highcharts/extending-highcharts