Как создать гистограмму Chart.JS с минимальным, максимальным и средним - PullRequest
0 голосов
/ 30 апреля 2019

У меня есть приложение, которое генерирует некоторые диаграммы Bart из службы. Мой клиент добавил дополнительную диаграмму для отображения диапазона (минимальный, максимальный и средний). Мне было интересно, если это способ сделать это с помощью chart.js. Я просмотрел их документы и не смог найти никаких примеров или документации о том, как это сделать. Кто-нибудь еще сталкивался с этим или имеет другую библиотеку, которую они предпочитают? A Graph That Looks Something Like This

1 Ответ

1 голос
/ 16 мая 2019

Chart.js поддерживает составные bar диаграммы с использованием следующей опции:

scales: {
    xAxes: [{
        stacked: true,
    }],
    yAxes: [{
        stacked: true
    }]
}

Используйте параметр fill: false для набора данных с минимальными значениями и fill: "-1" для наборов данных со средними и максимальными значениями,Затем выберите два разных backgroundColor s для среднего и максимального значения.

Я сделал пример на codepen: https://codepen.io/fantasyzer/pen/MdpMMv

Вы также можете изменить конфигурацию type на line, и этовсе еще будет работать.

Sample Chart

...