Highcharts Compare Date Ranges Bar Chart

Question

Я бы подумал, что это было бы довольно обычным делом, но я не могу найти примеры нигде. Я хочу сравнить 3 серии данных для двух разных диапазонов дат и видеть их рядом друг с другом на гистограмме. Его легче понять по картинке:

К сожалению, единственное, что я могу придумать, это добавить серию HIDDEN, а затем сделать мою легенду в html за пределами highchart. Пожалуйста, скажите мне, что есть лучший способ сделать это. Вот что я привел в качестве примера.

$(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