44 lines
1.3 KiB
HTML
44 lines
1.3 KiB
HTML
<html>
|
|
<script src="https://unpkg.com/timelines-chart"></script>
|
|
</html>
|
|
<body>
|
|
<div id="timeline"></div>
|
|
<script>
|
|
fetch("http://localhost:2503/api/v1/details",
|
|
{
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: '{ "start": "2021-09-01T00:00:00Z", "end": "2022-10-01T00:00:00Z" }'
|
|
}
|
|
)
|
|
.then((response) => {
|
|
if (!response.ok) {
|
|
throw new Error('Network response was not OK');
|
|
}
|
|
return response.json();
|
|
})
|
|
.then((payload) => {
|
|
console.log(payload);
|
|
payload.map((group) => {
|
|
Object.values(group.data).map((label) => {
|
|
label.data.map((interval) => {
|
|
interval.timeRange = interval.timeRange.map((t) => new Date(t));
|
|
})
|
|
})
|
|
});
|
|
TimelinesChart()
|
|
(document.body)
|
|
.timeFormat("%Y-%m-%dT%H:%M:%S.%LZ") // ISO 8601 format
|
|
.zScaleLabel('State')
|
|
.zQualitative(true)
|
|
.useUtc(false)
|
|
.data(payload)
|
|
}
|
|
)
|
|
.catch(err => { throw err });
|
|
</script>
|
|
</body>
|
|
</html>
|