CODEWITHSUNDEEP
javascriptcanvasjs
Péter Nagy
Péter Nagy

Reputation: 27

How to load datapoints from array in CanvasJS to make a chart?

i want to make a chart with data from an array. But couldn't figure out why isn't any data showing up in my chart. Can you guys help me to solve this problem?

   
   var dataset = [];
   
   
   
   $(data.items).each(function (index, item) 
   {

dataset.push(item.SQA);
   });
   

   console.log("5. item: " + dataset[5]);
   console.log("array items: " + dataset);
   
   var chart = new CanvasJS.Chart("wrapper_dia", {
   animationEnabled: true,
   theme: "light2",
   title:{
       text: "Simple Line Chart"
   },
   data: [{        
       type: "line",
       indexLabelFontSize: 16,
       dataPoints: dataset
       
   }]
   
   
});
chart.render();

Here is the picutre of the console.log with the data that i want to put on the line chart:

Upvotes: 0

Views: 1124

Answers (1)

Manoj Mohan
Manoj Mohan

Reputation: 662

You can loop through the array and parsing it to the format accepted by CanvasJS before passing to the chart options. Check the below code snippet for the same.

var dps = [];    
function parseDataPoints () {
    for (var i = 0; i <= dataArray.length; i++)
      dps.push({y: dataArray[i]});     
};
    
parseDataPoints();
chart.options.data[0].dataPoints = dps;
chart.render();

Check out this JSFiddle for an example on the same.

Upvotes: 1

Related Questions