54 lines
1.1 KiB
JavaScript
54 lines
1.1 KiB
JavaScript
async function initChart() {
|
|
const datasets = ["Playing", "Normal queue", "Priority queue"]
|
|
.map(label => ({ label, data: [] }))
|
|
|
|
const chart = new Chart(document.querySelector("#player-counts"), {
|
|
type: "line",
|
|
data: {
|
|
datasets: datasets,
|
|
},
|
|
options: {
|
|
scales: {
|
|
x: {
|
|
type: "time",
|
|
time: {
|
|
unit: "minute"
|
|
},
|
|
},
|
|
y: {
|
|
beginAtZero: true,
|
|
},
|
|
},
|
|
},
|
|
})
|
|
|
|
const range = document.querySelector("select#range")
|
|
|
|
const updateChart = async () => {
|
|
const data = await getPlayerCounts(range.value)
|
|
|
|
datasets[0].data = data.map(point => ({
|
|
x: point["time"] * 60 * 1_000,
|
|
y: point["playing"],
|
|
}))
|
|
|
|
datasets[1].data = data.map(point => ({
|
|
x: point["time"] * 60 * 1_000,
|
|
y: point["normal_queue"],
|
|
}))
|
|
|
|
datasets[2].data = data.map(point => ({
|
|
x: point["time"] * 60 * 1_000,
|
|
y: point["priority_queue"],
|
|
}))
|
|
|
|
chart.update()
|
|
}
|
|
|
|
range.addEventListener("change", e => updateChart())
|
|
updateChart()
|
|
}
|
|
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
initChart()
|
|
})
|