2014-10-28 7 views
1

У меня возникли проблемы с получением диаграмм диаграмм столбцов Highcharts (www.highcharts.com) с несколькими сериями данных для отображения, как хотелось бы. См. http://jsfiddle.net/jbreadner/6qsvjark/1/HighCharts stacked range range

Здесь показаны две диаграммы, «Верхняя диаграмма» и «Нижняя диаграмма».

В верхней диаграмме эффективно используются несколько рядов данных, как показано как в коде, так и в записях «Задача 1» и «Задача 2» в легенде. Проблема с этой диаграммой заключается в том, что полосы задач 1 и задачи 2 смещены друг от друга по вертикали.

series: [{ 
     name: 'Task 1', 
     stack: 'Tasks', 
     data: [{ 
      x: 0, 
      low: 7, 
      high: 8 
     }, { 
      x: 1, 
      low: 6.5, 
      high: 7.5 
     }] 
    }, { 
     name: 'Task 2', 
     stack: 'Tasks', 
     data: [{ 
      x: 0, 
      low: 8, 
      high: 9 
     }, { 
      x: 1, 
      low: 7.5, 
      high: 8.5 
     }] 
    }] 

Нижняя диаграмма отображает диапазон гистограмму, как я хотел бы видеть, но это заставляет цвет для каждой точки данных, а также при помощи одной серии данных, она нарушает функциональность легенды. Это приводит к уродливому коду с ограниченной функциональностью.

series: [{ 
     name: 'Data', 
     data: [{ 
      x: 0, 
      low: 7, 
      high: 8 
     },{ 
      x: 0, 
      low: 8, 
      high: 9, 
      color: "#202020" 
     },{ 
      x: 1, 
      low: 6.5, 
      high: 7.5 
     },{ 
      x: 1, 
      low: 7.5, 
      high: 8.5, 
      color: "#202020" 
     }] 
    }] 

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

Таблицы столбцов имеют свойство «стек», но это, похоже, не работает с типом диапазона диаграммы. Опция «стек» включена в верхнюю диаграмму.

спасибо, Джефф Breadner

+0

Извините, что сообщите об этом, но они на самом деле не застряли. предположим, что у нас есть две колонки: C1 (x, low1, high1) и C2 (x, low2, high2), если (low2 high1) вы увидите C2, полностью спрятавшийся C1 .. Принцип Stucking поставить C2 полностью сверху C1, что здесь не так. – user8005270

ответ

4

просто добавить:

plotOptions: { 
     columnrange: { 
      grouping: false 
     } 
    } 

к вашей карте. http://jsfiddle.net/6qsvjark/2/

+1

Удивительно, спасибо! –

+1

Некоторое время назад я пытался это сделать. Закончилось внедрение в D3.js. Интересно, это я, кто глуп, или если это Highcharts, это не очень понятно. –