How to addd JSON array daya into google column chart

Hello,
I am trying to add data dynamically into a chart but the console keeps on sending a message:
“Uncaught SyntaxError: Unexpected token ;”
Here is the code:

////////       Convert PhP $data array to JavaScript array    //////////
	  var datum = <?php echo json_encode($data); ?>;
	
	  
      google.charts.load('current', {'packages':['corechart', 'bar']});
      google.charts.setOnLoadCallback(drawVisualization);
	  

	
	  
	  
	////////////////////////    Drawing the graph    //////////////////////
      function drawVisualization() {
        		
         var data = google.visualization.arrayToDataTable([
			  data.addColumn('string', 'datum.profit');
              data.addColumn('number', 'datum.TotalBuyProfit');
			  data.addColumn('number', 'datum.TotalBuyLoss');
			  data.addColumn('number', 'datum.TotalSellProfit');
			  data.addColumn('number', 'datum.TotalSellLoss');

			  for (var i = 0; i < datum.length; i++){
              data.addRows(datum[i]);
			  }
         //['zzz', 'Profit', 'Loss', 'Profit', 'Loss'],
        // ['aaa', 165, -38, 165, -38],
         //['sss', 135, -120, 165, -38],
		// ['ccc', 165,-93, 165, -38],
        // ['ggg', 135, -110, 165, -38],
		// ['hhh', 135, -112, 165, -38],
		// ['rrr', 165, -98, 165, -98],
        // ['vvv', 135, -120, 165, -38]
      ]);

Here is the JSOn file:

[
 {"profit":"audcad",
  "TotalBuyProfit":"16.93",
  "TotalBuyLoss":"-16.86",
  "TotalSellProfit":"0.20",
  "TotalSellLoss":"-0.53"},
 
 {"profit":"audchf",
  "TotalBuyProfit":"8.87",
  "TotalBuyLoss":"-9.24",
  "TotalSellProfit":"0.29",
  "TotalSellLoss":"0.00"},
  
 {"profit":"audjpy",
   "TotalBuyProfit":"0.00",
   "TotalBuyLoss":"-1.76",
   "TotalSellProfit":"0.00",
   "TotalSellLoss":"0.00"},
   
 {"profit":"audnzd",
  "TotalBuyProfit":"6.75",
  "TotalBuyLoss":"-4.98",
  "TotalSellProfit":"0.00",
  "TotalSellLoss":"0.00"},
	
 {"profit":"audusd",
  "TotalBuyProfit":"1.06",
  "TotalBuyLoss":"-11.47",
  "TotalSellProfit":"13.94",
  "TotalSellLoss":"-10.44"},
	 
 {"profit":"euraud",
  "TotalBuyProfit":"0.00",
  "TotalBuyLoss":"-9.03",
  "TotalSellProfit":"0.00",
  "TotalSellLoss":"-3.01"},

 {"profit":"gbpaud",
  "TotalBuyProfit":"0.00",
  "TotalBuyLoss":"0.00",
  "TotalSellProfit":"0.13",
  "TotalSellLoss":"-7.92"}
]

The data after the // is raw data to see that the chart works well
What am I doing wrong?
I find many examples on the web, all are different/
I can’t find a site where I can get a good explanation.

What is the way to make it work?

The error’s dead right. In the drawVisualization function, semicolons don’t belong in the data array.

To be a little more specific,

arrayToDataTable is expecting an array (and optionally a boolean second parameter to indicate whether the first row are column headers).
What you seem to be doing is trying to stuff all of your commands into the initial constructor. Don’t.

I’d suggest looking at the examples google provides In the API specification for this function.

You appear to be trying to use the “Version 2” example, mixed with Version 1.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.