Выделение допустимого диапазона фона в Chart.js 2.0
Я работаю над созданием простой линейной диаграммы, используя Chart.js (бета-версия 2.0.2), и я хотел бы выделить определенный диапазон фона диаграммы, чтобы выделить «приемлемый диапазон».
Вот пример того, что я хочу воссоздать с помощью Charts.js:Пример допустимого диапазона
Если это полезно, вот что у меня работает до сих пор. Это довольно элементарно. Любое руководство или толчок в правильном направлении будет приветствоваться!
var bgdata = {
labels: ["12:00 AM", "1:00 AM", "2:00 AM", "3:00 AM", "4:00 AM", "5:00 AM", "6:00 AM", "7:00 AM", "8:00 AM", "9:00 AM", "10:00 AM", "11:00 AM", "12:00 PM", "1:00 PM", "2:00 PM", "3:00 PM", "4:00 PM", "5:00 PM", "6:00 PM", "7:00 PM", "8:00 PM", "9:00 PM", "10:00 PM", "11:00 PM"],
datasets: [
{
label: "Average Hourly Blood Glucose Reading",
fill: false,
backgroundColor: "rgba(29, 9, 158,0.2)",
borderColor: "rgba(29, 9, 158,1)",
data: [213, 199, 208, 191, 205, 181, 163, 133, 129, 186, 184, 137, 125, 126, 119, 120, 129, 133, 122, 156, 203, 207, 183, 211]
}
]
};
var bgChart = document.getElementById('bg').getContext('2d');
var bgLineChart = Chart.Line(bgChart, {
data: bgdata,
options: {
scaleFontSize: 12,
responsive: true,
scales: {
yAxes: [{
ticks: {min: 25, max: 250, stepSize: 25}
}],
},
title: {display: true, text: 'Average Hourly Blood Glucose'},
}});