I want to get yeniseries values from the database, i can use the API but I don't know what I should add to the javascript code, I would be happy if you help me.
var yeniSeries = [50, 80, 30];
window.addEventListener("load", function () {
try {
var grafikYapilandirma = {
chart: {
type: "donut",
width: 370,
height: 430,
},
colors: ["#622bd7", "#e2a03f", "#e7515a", "#e2a03f"],
dataLabels: {
enabled: false,
},
legend: {
position: "bottom",
horizontalAlign: "center",
fontSize: "14px",
markers: {
width: 10,
height: 10,
offsetX: -5,
offsetY: 0,
},
itemMargin: {
horizontal: 10,
vertical: 30,
},
},
plotOptions: {
pie: {
donut: {
size: "75%",
background: "transparent",
labels: {
show: true,
name: {
show: true,
fontSize: "29px",
fontFamily: "Nunito, sans-serif",
color: undefined,
offsetY: -10,
},
value: {
show: true,
fontSize: "26px",
fontFamily: "Nunito, sans-serif",
color: "#1ad271",
offsetY: 16,
formatter: function (t) {
return t;
},
},
total: {
show: true,
showAlways: true,
label: "Total",
color: "#888ea8",
formatter: function (t) {
return t.globals.seriesTotals.reduce(function (n, e) {
return n + e;
}, 0);
},
},
},
},
},
},
stroke: {
show: true,
width: 15,
colors: "#0e1726",
},
series: yeniSeries,
labels: ["Online", "Offline", "Rest"],
responsive: [
{ breakpoint: 1440, options: { chart: { width: 325 } } },
{ breakpoint: 1199, options: { chart: { width: 380 } } },
{ breakpoint: 575, options: { chart: { width: 320 } } },
],
};
var grafik = new ApexCharts(
document.querySelector("#chart-2"),
grafikYapilandirma,
);
grafik.render();
document
.querySelector(".theme-toggle")
.addEventListener("click", function () {
var yeniSeries = [200, 300, 500];
grafik.updateOptions({ series: yeniSeries });
});
} catch (hata) {
console.log(hata);
}
});
I would appreciate it if you could help, thank you
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire