Question

我有一个包含大量数据的高价图，我能够定义如何对数据进行分组，但我喜欢用户指定要使用的数据分组，并在日，周，月等之间动态更改。

那么有可能有一个按钮，用户可以根据这个按钮更改数据的分组方式，如果是这样的话？

有许多未记录的功能，例如currentDataGrouping，但没有设置数据分组......我可以看到任何方式...

series: [{
                type: 'column',
                name: title,
                data: data,
                dataGrouping: {
                    units: [['week', [1]], ['month', [1]]]
                }
        }]

Answer 1

API有一种更新系列的方法（http://api.highcharts.com/highcharts#Series.update()）。 e.g。

chart.series[0].update({ type: 'spline' });

您应该能够使用此API调用来修改任何系列属性。

例如，您可以定义两个系列对象，并更新图表以使用按钮单击时所需的图表：

var seriesWeek = {
            type: 'column',
            name: title,
            data: data,
            dataGrouping: {
                units: [ ['week', [1] ] ]
            }
    }

var seriesMonth = {
            type: 'column',
            name: title,
            data: data,
            dataGrouping: {
                units: [ ['month', [1] ] ]
            }
    }

chart.series[0].update(seriesWeek);

Answer 2

我们尝试了围绕此问题，我们使用Highstock＆＃39; s（Splinechart）RangeSelector，事件和DataGrouping。点击每周rangeselectorButton，我们通过setExtremes捕获此事件。发布事件后，将其近似为＆＃34; sum＆＃34;。如果你使用两个系列而不是迭代对象。

  events: {
         setExtremes: function (e) {
             if (e.rangeSelectorButton != undefined) {
                 var triger = e.rangeSelectorButton;
                 if (triger.type == 'week') {
                     $.each(this.series, function (index, obj) {
                         obj.options.dataGrouping.units[0] = ['week', [1]];
                     });
                 } else if (triger.type == 'day') {
                     $.each(this.series, function (index, obj) {
                         obj.options.dataGrouping.units[0] = ['day', [1]];
                     });
                 }
             }
         }
     },

@ fiddle

Answer 3

我总是只有一个时间序列，因此这种方法对我有用（无需手动更新每个时间序列）：

self.myChart = new window.Highcharts.stockChart(pChartDivContainer, {
        title: {
            text: 'My title'
        },
        rangeSelector: {
            enabled: true
        },
        plotOptions: {
            series: {

                dataGrouping: {
                    approximation: 'ohlc',
                    units: [
                        ["minute", [1]]
                    ],
                    forced: true,
                    enabled: true,
                    groupAll: true
                }

            }
        }
    }, function (chart) {
        self.onChartReady();
    });

之后，很容易更改单位：

self.setCandleInterval = function (pUnit, pInterval) {
    self.myChart.update({
        plotOptions: {
            series: {
                dataGrouping: {
                    units: [
                        [pUnit, [pInterval]]
                    ]
                }
            }
        }
    });
}

Highcharts：如何设置dataGrouping

3 个答案: