Highcharts比较日期范围条形图

Question

我会认为这将是一个相当普遍的事情，但我无法找到任何地方的例子。我想比较2个不同日期范围的3个数据系列，并在条形图中看到它们相邻。它更容易理解的图片：

不幸的是，我能想到的唯一的事情就是添加一个HIDDEN系列，然后在highchart以外的html中执行我的图例。请告诉我有一个更好的方法来做到这一点。这就是我举出的例子。

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'bar' 
     }, 
     title: { 
      text: 'Safe Places To Visit' 
     }, 
     xAxis: { 
      categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'], 
      title: { 
       text: null 
      } 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: 'Survey Count', 
       align: 'high' 
      }, 
      labels: { 
       overflow: 'justify' 
      } 
     }, 
     plotOptions: { 
      bar: { 
       dataLabels: { 
        enabled: true 
       } 
      }, 
      series: { 
       dataLabels: { 
        enabled: false 
       } 
      } 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'top', 
      x: -40, 
      y: 100, 
      floating: true, 
      borderWidth: 1, 
      backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'), 
      shadow: true 
     }, 
     credits: { 
      enabled: false 
     }, 
     series: [{ 
      name: 'Recommend', 
      data: [107, 31, 635, 203, 2] 
     }, { 
      name: 'Recommend W/ Comp', 
      data: [133, 156, 947, 408, 6] 
     }, { 
      name: 'Dont Recommend', 
      data: [973, 914, 4054, 732, 34] 
     }, { 
      name: 'HIDDEN', 
      data: [0, 0, 0, 0, 0] 
     }, { 
      name: 'Recommend', 
      data: [107, 31, 635, 203, 2] 
     }, { 
      name: 'Recommend W/ Comp', 
      data: [133, 156, 947, 408, 6] 
     }, { 
      name: 'Dont Recommend', 
      data: [973, 914, 4054, 732, 34] 
     }] 
    }); 
}); 

你可以看到小提琴here。

Answer 1

我想你可以在这里找到答案：

• Grouping Legends in Highcharts
• How to get multiple data series into Highcharts