根據縮放級別更改列數：HighChart（列圖類型）

Question

我有5年的數據顯示在列圖中。當我放大時，我想將每個月顯示爲列。但是，當我縮小它應該是每年的專欄。這是可能的高圖表。

基本上我想根據縮放設置列數。

Answer 1

只有在highstock中才能使用dataGrouping - http://www.highcharts.com/docs/advanced-chart-features/data-grouping。這可能是你在找什麼。例如：http://jsfiddle.net/w5bonc2c/

$(function() { 
    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=large-dataset.json&callback=?', function (data) { 

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

     // Create the chart 
     $('#container').highcharts('StockChart', { 
      chart: { 
       events: { 
        load: function() { 
         this.setTitle(null, { 
          text: 'Built chart in ' + (new Date() - start) + 'ms' 
         }); 
        } 
       }, 
       zoomType: 'x', 
       type: 'column' 
      }, 

      rangeSelector: { 
       inputEnabled: $('#container').width() > 480, 
       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, 2004-2010' 
      }, 

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

      series: [{ 
       name: 'Temperature', 
       data: data, 
       pointStart: Date.UTC(2004, 3, 1), 
       pointInterval: 3600 * 1000, 
       tooltip: { 
        valueDecimals: 1, 
        valueSuffix: '°C' 
       } 
      }] 

     }); 
    }); 
});