Google Chart with dynamic array

Question

How to convert this array to add in google chart new data variable:

var array_column =["Year","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var array_rows = ["2014", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.67, 0, "2015", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.33, 0, "2016", 0, 0, 0, 0, 4, 0, 0, 0, 0, 4, 4, 2.67, "2017", 2, 0, 0, 4.33, 2.67, 0, 2.5, 0, 0, 0, 0, 0, "2018", 0, 0, 2.17, 0, 0, 0, 0, 0, 0, 0, 0, 0]

Basically the array_rows are dynamically added by 13. On array_column is fixed with the length of 13. Is there a way on how to add the array_rows above by 13 and make it like this?

 var newData = [
['Year', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
["2014", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.67, 0],
["2015", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.33, 0],
["2016", 0, 0, 0, 0, 4, 0, 0, 0, 0, 4, 4, 2.67],
["2017", 2, 0, 0, 4.33, 2.67, 0, 2.5, 0, 0, 0, 0, 0],
["2018", 0, 0, 2.17, 0, 0, 0, 0, 0, 0, 0, 0, 0]
         ];

      // in this case the first column is of type 'string'.
      dataTable.addColumn('string', newData[0][0]);

      // all other columns are of type 'number'.
      for (var i = 1; i < numCols; i++)
        dataTable.addColumn('number', newData[0][i]);           

      // now add the rows.
      for (var i = 1; i < numRows; i++) 
        dataTable.addRow(newData[i]);        

      // redraw the chart.
      chart.draw(dataTable, options);

//--------------------updated-------------------------------

var array_column = ["Year","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var array_rows = ["2014", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.67, 0, "2015", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.33, 0, "2016", 0, 0, 0, 0, 4, 0, 0, 0, 0, 4, 4, 2.67, "2017", 2, 0, 0, 4.33, 2.67, 0, 2.5, 0, 0, 0, 0, 0, "2018", 0, 0, 2.17, 0, 0, 0, 0, 0, 0, 0, 0, 0]

var splice=13;
var arr = array_rows;
var newarr = new Array();

console.log("newarr_column: "+array_column);

for (var i=0; i<arr.length; i=i+splice) {
    newarr.push(arr.slice(i,i+splice));
    console.log("slice: "+arr.slice(i,i+splice))
}


//Is this correct?
 var newData = [array_column,newarr];

and it gives me this error in google chart:

When i used this variable it worked.

var newData = [
    ['Year', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
    ["2014", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.67, 0],
    ["2015", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.33, 0],
    ["2016", 0, 0, 0, 0, 4, 0, 0, 0, 0, 4, 4, 2.67],
    ["2017", 2, 0, 0, 4.33, 2.67, 0, 2.5, 0, 0, 0, 0, 0],
    ["2018", 0, 0, 2.17, 0, 0, 0, 0, 0, 0, 0, 0, 0]
             ];

The logic for splitting the array into chunks can be found [here](https://stackoverflow.com/questions/8495687/split-array-into-chunks) — James, Jul 27 '17 at 02:30

rolspace · Accepted Answer · 2017-08-06T22:56:43.113

I have modified your code to be consistent with what you have already written, but it can be cleaned up a bit.

The problem with your initial solution is that this statement,

var newData = [array_column,newarr];

is creating an array with the columns array as the first element and a second array that contains the arrays with the rows. In order for the chart to work, you need to have one array with the columns as the first element and the first row as the second element, the second row as the third element, and so on...

That's why I modified your code to push the array_column into the result array before the rows are split (thanks @WhiteHat)

newarr.push(array_column);

Here is the modified code:

var array_column = ["Year","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var array_rows = ["2014", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.67, 0, "2015", 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2.33, 0, "2016", 0, 0, 0, 0, 4, 0, 0, 0, 0, 4, 4, 2.67, "2017", 2, 0, 0, 4.33, 2.67, 0, 2.5, 0, 0, 0, 0, 0, "2018", 0, 0, 2.17, 0, 0, 0, 0, 0, 0, 0, 0, 0]

var splice=13;
var arr = array_rows;
var newarr = new Array();

console.log("newarr_column: "+array_column);

newarr.push(array_column);

for (var i=0; i<arr.length; i=i+splice) {
    newarr.push(arr.slice(i,i+splice));
    console.log("slice: "+arr.slice(i,i+splice))
}

newData = newarr;

might be easier just to add `array_column` to `newarr` before slicing the rows, then your done... — WhiteHat, Jul 27 '17 at 11:45
@WhiteHat yes, you are right, I will make that change to the answer. — rolspace, Jul 27 '17 at 11:56

Google Chart with dynamic array

1 Answers1