Несколько столбцов на той же серии. Highchart

Question

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

Код серии будет примерно таким.

series: [{ name: 'Car 1', data: [[1, 3], [4, 6], [7, 9]] }, { name: 'Car 2', data: [[2, 3], [8, 10], [12, 18]] }]

Первое число в каждом массиве будет начальной точкой и второй точкой отделки, и все массивы внутри основного массива были бы на одной и той же линии.

Answer 1

Перевернутая диаграмма столбцов должна работать. Ваши данные не отформатированы таким образом, чтобы работать с тем, что вы хотите, но преобразовать его не сложно. Если вы не застряли в формате данных, который вы показали, вам просто нужен точечный объект с x, низким и высоким.

Например:

{ 
    x: 1, 
    low: 0, 
    high: 4 
} 

следующие виды массажа текущая структура в правильном формате: // jsfiddle:

$(function() { 

    var series = [{ 
     name: 'Car 1', 
     data: [ 
      [1, 3], 
      [4, 6], 
      [7, 9] 
     ] 
    }, { 
     name: 'Car 2', 
     data: [ 
      [2, 3], 
      [8, 10], 
      [12, 18] 
     ] 
    }, { 
     name: 'Car 3', 
     data: [ 
      [5, 9], 
      [1, 2] 
     ] 
    }]; 

    // massage the data 
    var data = []; 
    for(var i=0;i<series.length;i++) { 
     for(var j=0;j<series[i].data.length;j++) { 
      data.push({ 
       x: j, 
       low: series[i].data[j][0], 
       high: series[i].data[j][1], 
       name: series[i].name 
      }); 
     } 
    } 

    $('#container').highcharts({ 

     chart: { 
      type: 'columnrange', 
      inverted: true 
     }, 

     plotOptions: { 
      columnrange: { 
       dataLabels: { 
        enabled: false 
       } 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 

     series: [{ 
      name: 'Cars', 
      data: data 
     }] 

    }); 

}); 

http://jsfiddle.net/hqwrx4uy/