Два типа диаграмм в одном?

#jquery #highcharts

#jquery #высокие диаграммы

Вопрос:

Возможно ли сгенерировать диаграмму, подобную следующей, с помощью Highcharts? Если да, то как мне это сделать?

введите описание изображения здесь

Верхняя диаграмма не является проблемой. Кроме того, мне нужны сложенные блоки ниже. Схемы было бы достаточно.

Я унаследовал проект от коллеги, который уже использует Highcharts, и теперь мне нужно расширить функциональность.

Ответ №1:

Да, это возможно. Я собрал jsfiddle для имитации того, что вы хотите сделать.

http://jsfiddle.net/vbpDS/4312/

Итак, важная часть:

В вашей коллекции рядов вам нужно указать, что вы хотите, чтобы конкретный ряд имел тип столбца (если для вашего типа по умолчанию установлено значение line — то есть, если тип не определен в ряду, он будет автоматически отображаться как тот, который установлен по умолчанию).

 chart: {
        renderTo: 'container',
        defaultSeriesType: 'line'
    },
    series: [{
        type: 'column',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        stack:'1'

    },{
        type: 'column',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        stack:'1'

    }
             , {
        data: [129.9, 271.5, 306.4, 29.2, 544.0, 376.0, 435.6, 348.5, 216.4, 294.1, 35.6, 354.4]

    },{
        data: [100, 110, 120, 130, 140, 150, 140, 130, 120, 110, 100, 110]  
    }]
  

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

РЕДАКТИРОВАТЬ: Кстати, документация highcharts api отличная! Проверьте это для получения дополнительной информации: http://www.highcharts.com/ref /