Ta1ha: added chart widget

2023-07-21T17:57:24Z

added chart widget

New page

<includeonly>
<div>
<canvas id=""></canvas>
</div>

<script>
var data = JSON.parse('');
var color = '';
var gridColor = '';
var axisColor = '';
var fontColor = '';

if (color == "") {
color = "black";
}

if (gridColor == "") {
gridColor = "lightgray";
}

if (axisColor == "") {
axisColor = gridColor;
}

if (fontColor == "") {
fontColor = "gray";
}

var max = data[0]["x"];
var min = max;
for (let i = 0; i < data.length; i++) {
if (data[i]["x"] > max) {
max = data[i]["x"];
}
if (data[i]["x"] < min) {
min = data[i]["x"];
}
}

var range = [...Array(max - min + 1).keys()].map((x) => x + min);

new Chart(document.getElementById(''), {
type: "line",
axisX: {
gridColor: "orange",
},
data: {
labels: range,
datasets: [
{
data: data,
borderColor: color,
backgroundColor: color,
fill: false,
},
],
},
options: {
plugins:{
legend: {
display: false
}
},
scales: {
y: {
grid: {
color: gridColor
},
border: {
color: axisColor
},
ticks: {
color: fontColor
}
},
x: {
type: 'linear',
grid: {
color: gridColor
},
border: {
color: axisColor
},
ticks: {
color: fontColor
}
}
}
}
});

</script>
</includeonly>

Widget:Chart - Revision history

Ta1ha: added chart widget