Chart.js
Chart.js copied to clipboard
Show Data Time in Line Chart
Documentation Is:
- [X] Missing or needed?
- [X] Confusing
- [ ] Not sure?
Please Explain in Detail...
Good afternoon, I want to create a line chart where the dates are displayed on the X-axis and the hours on the Y-axis, but the problem is that I don't know how to do it. So far, I have the following. And there is nothing mentioned about it in the documentation.
const UUD = [{
x: '2023-11-07 23:39:30',
y: '2023-11-07 19:39:30'
}];
const UUM = [{
x: '2023-11-08 01:00:28',
y: '2023-11-08 09:39:30'
}];
// setup
const data1 = {
labels: fechas,
datasets: [{
label: 'Usuarios Unicos Diarios - Whatsapp',
data: UUD,
fill: false,
borderColor: 'rgb(75, 192, 192)',
tension: 0.1
}, {
label: 'Usuarios Unicos Mensuales - Whatsapp',
data: UUM,
fill: false,
borderColor: 'rgb(75, 192, 192)',
tension: 0.1
}]
};
// config
const config1 = {
type: 'line',
data: data1,
options: {
//maintainAspectRatio: false,
scales: {
x: {
min: '2023-11-07 00:00:00',
},
y: {
type: 'time',
time: {
unit: 'hour'
}
}
}
}
};
// render init block
const myChart1 = new Chart(
document.getElementById('myChart1'),
config1
);
### Your Proposal for Changes
Add more examples and way to show data.
### Example
_No response_