Cómo agregar dinámicamente filas / columnas a un gráfico de columnas de Google

Quiero crear un Gráfico de columnas, usando la API de visualización de Google. Puedo enviar los datos para rellenar la tabla de datos del gráfico en forma de matriz. Pero necesito generar el gráfico con un número variable de columnas / filas, dependiendo de lo que contengan mis matrices y no sé cómo iterarlas correctamente y agregarlas a DataTable.

Aquí hay un ejemplo para analizar datos STATIC para generar el gráfico: (todo esto está en javascript)

var data = google.visualization.arrayToDataTable([ ['Year', 'Sales', 'Expenses'], ['2004', 1000, 400], ['2005', 1170, 460], ['2006', 660, 1120], ['2007', 1030, 540] ]); 

La API tiene estos methods para agregar columnas y filas: – método diferente para get los mismos datos que arriba:

 var data = new google.visualization.DataTable(); data.addColumn('string', 'Year'); data.addColumn('number', 'Sales'); data.addColumn('number', 'Expenses'); data.addRows([ ['2004', 1000 , 400], ['2005', 1170, 460], ['2006', 660, 1120], ['2007',1030,540] ]); 

Lo que necesito es un bucle for o un bucle for for para iterar las lists de arreglos que envío y agregar dinámicamente el contenido de las filas.

Para ser más precisos, digamos que en un caso tendría los datos escritos anteriormente, y en otro caso tendría esto:

 ['Year', 'Sales', 'Expenses' , 'Other'], ['2004', 1000, 400 , 232 ], ['2005', 1170, 460 , 421 ], ['2006', 660, 1120 , 4324 ], ['2007', 1030, 540 , 4234 ], ['2008', 1530, 50 , 234 ], 

así que analizaría estos datos a través de parameters en la function digamos (no sé si esta sería la ideea correcta) muchas lists de arreglos que contienen cada fila: Fila1 = ['2004', 1000, 400, 232] Fila2 = [' 2005 ', 1170, 460, 421] y ….

¿Cómo puedo usar un bucle for o un bucle for for para iterar las lists de arreglos que estoy enviando a dynamic generate the datatable (con numbers variables de filas y columnas) que contienen los datos?

Aquí hay una solución de trabajo en jsfiddle .

Mira la siguiente function. Esto itera sobre una matriz de datos y actualiza el gráfico:

 // function to update the chart with new data. function updateChart() { dataTable = new google.visualization.DataTable(); var newData = [['Year', 'Sales', 'Expenses' , 'Other'], ['2004', 1000, 400 , 232 ], ['2005', 1170, 460 , 421 ], ['2006', 660, 1120 , 4324 ], ['2007', 1030, 540 , 4234 ], ['2008', 1530, 50 , 234 ]]; // determine the number of rows and columns. var numRows = newData.length; var numCols = newData[0].length; // 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]); // networkingraw the chart. chart.draw(dataTable, options); } 
 var obj = JSON.parse(rd);//Json data will come from any web service or any other source var data2 = new google.visualization.DataTable(); //To Add Column Dynamically for (var j = 0; j < array.length; j++) // this array contains columns { if (j == 0) { data2.addColumn(typeof (array[j]), array[j]); } else { data2.addColumn('number', array[j]);//if 2nd column must be integer } } // To Add Rows Dynamically to a google chart data2.addRows(obj.length);\\Total Rows for (var i = 0; i < obj.length; i++) { for (var k = 0; k < array.length; k++)//Total Column { if (k == 0) { data2.setCell(i, k, obj[i][array[k]].toString());//if first Column is String } else { data2.setCell(i, k, parseInt([obj[i][array[k]]]));//if other columns are int type... for charts mostly we treat just first column as string } } } 

Puede poner los datos en una cadena y usar JSON.parse (stringData). La columna del año debe estar entre comillas dobles

 var data = new google.visualization.DataTable(); data.addColumn('string', 'Year'); data.addColumn('number', 'Sales'); data.addColumn('number', 'Expenses'); var stringData = '[["2004", 1000 , 400], ["2005", 1170, 460], ["2006", 660, 1120], ["2007",1030,540]]'; data.addRows(JSON.parse(stringData));