Hi, I have a form on my webpage, and once the user fills it and submits the data.
They get back an array of objects from server:
newSal array of objects value:
[ {
label : "and",
y : 100
}, {
label : "the",
y : 50
} ]
So how I do populate and update the graph?
I think the problem may be because the canvas function is executed on windows load, while the data is attained when user submits form.
Code so far:
var httpReq = new XMLHttpRequest();
var newSal;
var chart;
function loadDoc() {
httpReq.open("GET", "URL/URI", true);
httpReq .onreadystatechange = processInfo;
httpReq .send();
}
function processInfo() {
if (httpReq.readyState == 4 && httpReq.status == 200) {
document.getElementById("demo").innerHTML = httpReq.responseText;
}
newSal = xhttp.responseText;
chart.render();
}
window.onload = function () {
console.log(newSal);
chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
title: {
text: "My Graph"
},
axisX: {
title: "X Label"
},
axisY: {
title: "Y",
},
data: [{
type: "column",
dataPoints: newSal
}]
});
chart.render();
};
Thanks for help guys!
-
This topic was modified 6 years ago by Dali_Sarb.