Destaque aceitável do intervalo em segundo plano no Chart.js 2.0
Estou trabalhando na criação de um gráfico de linhas simples usando o Chart.js (versão 2.0.2 beta) e gostaria de destacar um intervalo específico do plano de fundo do gráfico para destacar um "intervalo aceitável".
Aqui está um exemplo do que estou querendo recriar via Charts.js:Exemplo de intervalo aceitável
Se for útil, aqui está o que eu tenho trabalhando até agora. É bastante rudimentar. Qualquer orientação ou um empurrão na direção certa seria apreciada!
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'},
}});