У меня есть система мониторинга воды, которая каждую минуту сообщает об уровне бака и значениях использования.У меня есть мобильное приложение, которое отображает данные, но я хочу разместить информацию на общей веб-странице, чтобы люди в доме ее увидели.
, но при просмотре за 3 дня более 4000 точек данных.. значения диапазона данных уровня находятся в диапазоне от 1750 до 2029 (и я вижу их на оси у сверху и снизу)
, сейчас я получаю прямую линию (от начала массива до конца) для использования иэлементы данных уровня ..
var myChart = new Chart(canvas, {
type: 'line',
showLine: true,
data: {
datasets: [
{
xAxisID: 'dates',
data: self.data[self.config.Pins[1]],
fill:true,
borderColor: '#2196f3', // Add custom color border (Line)
backgroundColor: '#2196f3',
//borderWidth: 1,// Specify bar
}
]
},
options: {
legend: { display: false, },
responsive: true,
elements: {
line: {
tension: 0, // disables bezier curves
}
},
scales: {
xAxes: [{
id: 'dates',
type: 'time',
distribution: 'linear',
scaleLabel: {
display: true,
labelString: 'Water Usage, gallons'
},
time: {
unit: 'minute'
},
bounds: 'data',
ticks: {
display: false ,
maxRotation: 90,
source: 'data',
maxTicksLimit: self.data[self.config.Pins[1]].length, },
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'used'
},
ticks: {
beginAtZero: true,
source: 'data',
min: 0,
//max: self.data[self.config.Pins[1]].length,
},
}]
},
}
});
приветствуется любое указание
оси x и y отображаются с правыми метками, ось Y имеет правильную шкалу чисел от данных, представленных на диаграммеМАКСИМАЛЬНОЕ значение оси Y в верхнем левом углу (411,0000) справа, той же высоты, является точкой, которая отображает дату / время.правый край графика, также показывает различные значения даты / времени ... как будто верхний край нарисован справа ...
, но правый край - это СТЕК всех значений, от низкого довысокий, где их метки времени игнорируются ... все нарисовано на правом краю .. как будто шаг нарисовал 1-ю точку на левом крае, затем следующую точку на правом краю, и тогда больше не было места, поэтому продолжал рисовать точкина крайнем правом краю.