L A

L A

  • NA
  • 170
  • 168.3k

Google Chart - DataTable.addRow()

Jun 19 2017 1:11 PM
Hello,

I`m trying add rows to a DataTable() but my column headers have spacing and special symbols like Meat/Poultry, Dairy Products, etc.,
  1. $.ajax({  
  2.                 url: "@Url.Action("TotalSales", "Chart")",  
  3.                 data: "{}",  
  4.                 dataType: "json",  
  5.                 type: "POST",  
  6.                 contentType: "application/json",  
  7.                 success: function (data) {  
  8.                     var Data = new google.visualization.DataTable();  
  9.                     Data.addColumn('number''Confections');  
  10.                     Data.addColumn('number''Meat/Poultry');  
  11.                     Data.addColumn('number''Condiments');  
  12.                     Data.addColumn('number''Dairy Products');  
  13.                     Data.addColumn('number''Beverages');  
  14.                     Data.addColumn('number''Grains/Cereals');  
  15.                     Data.addColumn('number''Seafood');  
  16.                     Data.addColumn('number''Produce');  
  17.                     Data.addColumn('number''ShippingYear');  
  18.                     for (var i = 0; i < data.length; i++) {  
  19.                         console.log("Im in ComboChart Success");  
  20.                         Data.addRow([data[i].ShippingYear, data[i].Confections,
  21. data[i].Meat/ Poultry, data[i].Condiments, data[i].Dairy Products, data[i].Beverages,
  22. data[i].Grains/ Cereals, data[i].Seafood, data[i].Produce]);  
  23.                         console.log("Inserting data");  
  24.                     }  
  25.                     var options = {  
  26.                         height: 600,  
  27.                         width: 700,  
  28.                         title: 'Total Category Wise Sales 1996_1997',  
  29.                         vAxis: {  
  30.                             title: 'Sales',  
  31.                             format: 'currency'  
  32.                         },  
  33.                         hAxis: {  
  34.                             title: 'ShippingYear'  
  35.                         }  
  36.                     };  
  37.                     var chartspace = new google.visualization.BarChart(document.getElementById('comboChart'));  
  38.                     chartspace.draw(Data, options);  
  39.                 },  
  40.                 error: function () {  
  41.                     alert("Error loading data! Please try again.");  
  42.                 }  
  43.             });
In the above ajax call, Line # 21, 22 cause error.
I can`t add column names which are different. Please help me to achieve this.
 
Thanks in advance.

Answers (7)