javascript - Update Google Charts -


i developing application, have data in csv format , want show them in line chart using google visualization api, send data json view , show chart:

<script type="text/javascript"> results = [];  google.load("jquery", "1.3.2"); google.load("visualization", "1", {packages:["corechart"]}); google.setonloadcallback(function(){     $.getjson("http://localhost:8081/petclinic/users/7/campaigns/2/queries/4/analyze", function(data){         (var = 1; < data.length; i++) {                 data[i][1] =parseint(data[i][1]);         }          var data = google.visualization.arraytodatatable(data);         var options = {           title: 'data analysis'         };          var chart = new google.visualization.linechart(document.getelementbyid('chart_div'));         chart.draw(data, options);     }); }); </script> 

this works correctly, want add other data chart, example, if click on button data should updated new info , line chart should drawn able compare them.

here example: example in beginning data shown:

            var data = google.visualization.arraytodatatable([                                                            ['date', 'obama'],                                                            ['07/05/2004',  1000],                                                            ['08/05/2004',  1170],                                                            ['09/05/2004',  660],                                                            ['10/05/2004',  1030],                                                            ['11/05/2004',  1030],                                                            ['12/05/2004',  1030],                                                            ['13/05/2004',  1030],                                                          ]); 

then want add other data chart this:

            var data = google.visualization.arraytodatatable([                                                            ['date', 'obama', 'romney'],                                                            ['07/05/2004',  1000,      400],                                                            ['08/05/2004',  1170,      460],                                                            ['09/05/2004',  660,       1120],                                                            ['10/05/2004',  1030,      540],                                                            ['11/05/2004',  1030,      540],                                                            ['12/05/2004',  1030,      540],                                                            ['13/05/2004',  1030,      540],                                                          ]); 

there couple of ways can go doing this:

  1. if know data during initial transaction send csv data, can populate data in datatable, , use dataview view of columns. when want display additional columns, easiest thing create new dataview, , redraw chart.
  2. if don't know data, , need second call server new data, once data returned, can add new data datatable addcolumn function, , use setcell every item. call draw on chart again. (i've filed feature request have addcolumn accept array make easier.)

incidentally, i've filed feature request accept csv files directly in datatable. obviously, make no promises when/if of these feature requests done.


Comments