Chart.js - Snippets: Unterschied zwischen den Versionen
Aus Wikizone
| (Eine dazwischenliegende Version von einem anderen Benutzer wird nicht angezeigt) | |||
| Zeile 1: | Zeile 1: | ||
| + | == Links == | ||
| + | [[Chart.js]] | ||
== Daten manipulieren == | == Daten manipulieren == | ||
<syntaxhighlight lang="javascript"> | <syntaxhighlight lang="javascript"> | ||
| Zeile 21: | Zeile 23: | ||
chart.data.datasets.push(newDataset); | chart.data.datasets.push(newDataset); | ||
chart.update(); | chart.update(); | ||
| + | |||
| + | |||
| + | // Setze hidden attribut (jquery) | ||
| + | $("#toggle").click(function() { | ||
| + | chartInstance.data.datasets.forEach(function(ds) { | ||
| + | ds.hidden = !ds.hidden; | ||
| + | }); | ||
| + | chartInstance.update(); | ||
| + | |||
</syntaxhighlight> | </syntaxhighlight> | ||
Aktuelle Version vom 26. Juni 2023, 16:52 Uhr
Links[Bearbeiten]
Daten manipulieren[Bearbeiten]
// Datensatz entfernen
chart.data.datasets.pop();
chart.update();
// Daten von allen Datensätzen hinten entfernen
chart.data.datasets.forEach(dataset => {
dataset.data.pop();
});
// Datensatz hinzufügen
const data = chart.data;
const dsColor = Utils.namedColor(chart.data.datasets.length);
const newDataset = {
label: 'Dataset ' + (data.datasets.length + 1),
backgroundColor: Utils.transparentize(dsColor, 0.5),
borderColor: dsColor,
data: Utils.numbers({count: data.labels.length, min: -100, max: 100}),
};
chart.data.datasets.push(newDataset);
chart.update();
// Setze hidden attribut (jquery)
$("#toggle").click(function() {
chartInstance.data.datasets.forEach(function(ds) {
ds.hidden = !ds.hidden;
});
chartInstance.update();