如何使用canvasJs绘制图形？

Question

Here I try to plot a graph using dynamic data inputs array data

But I'm getting some error in the console Error: canvasjs.min.js:197 Uncaught TypeError: Cannot read property 'getTime' of undefined

 window.onload = function () { function setObject(name) { this.y = name; } var inputs=[1,23,21,2,67,54] var arr = []; for (var i = 0; i < inputs.length; i++) { var cookieValue = inputs[i]; var setObj = new setObject(cookieValue); arr.push(setObj); } plot1 = JSON.stringify(arr, null, 2); var plot = [{ "y":1},{ "y":23},{ "y":21},{ "y":2},{ "y":67},{ "y":54}] var graph = [{ type: "line", //when i try to use plot1 instead of plot then graph not showing dataPoints:plot }] var chart = new CanvasJS.Chart("chartContainer", { animationEnabled: true, theme: "light2", title:{ text: "Simple Line Chart" }, axisY:{ includeZero: false }, data: graph }); chart.render(); } 

 <script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script> <div id="chartContainer" style="height: 300px; width: 100%;"></div> 

When I try to use dataPoints:plot1 then it's not working

plot and plot1 have same data but Why it's happening? am I using the wrong approach? Thanks In advance

Answer 1

Your variables plot and plot1 are not equivalent. plot is an array, but plot1 is a string. CanvasJS dataPoints option expects an array, so if you give it a string, it doesn't work.

I don't know why you decided to use JSON.stringify() here, which converts your arr to a string. Just use arr directly!

var graph = [{
    type: "line",
    dataPoints: arr
}]