Highcharts: Cách thiết lập dataGrouping

Question

Tôi có biểu đồ highstock với nhiều dữ liệu trong đó, tôi có thể xác định cách dữ liệu có thể được nhóm, nhưng Id như người dùng xác định nhóm dữ liệu nào sẽ sử dụng và thay đổi động giữa ngày , tuần, tháng, v.v.

Vì vậy, có thể có nút để người dùng có thể thay đổi cách dữ liệu được nhóm lại, nếu có thì làm cách nào?

Có rất nhiều tính năng undocumentated, ví dụ currentDataGrouping, nhưng không có gì để thiết lập các nhóm dữ liệu ... mà tôi có thể nhìn thấy bất cứ cách nào là ...

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

Answer 1

API có một phương pháp để cập nhật series (http://api.highcharts.com/highcharts#Series.update()). ví dụ.

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

Bạn sẽ có thể sử dụng lệnh gọi API này để sửa đổi bất kỳ thuộc tính chuỗi nào.

Ví dụ, bạn có thể có hai đối tượng loạt định nghĩa, và cập nhật các biểu đồ sử dụng một trong những bạn muốn trên một nút bấm:

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

Chúng tôi đã thử một Hack xung quanh này, nơi mà chúng tôi sử dụng Highstock của (Splinechart) RangeSelector, Sự kiện và DataGrouping. Khi nhấp vào phạm vi hàng tuần, chúng tôi sẽ thu sự kiện này qua setExtremes. Đăng sự kiện gần đúng để "tổng hợp". Nếu bạn đang sử dụng hai chuỗi hơn là lặp lại đối tượng.

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