Is there an exiting js method/library to convert regular json objects to google visualization type of js objects?

we have existing rest web services that generates json response. now we want to use google charts to show those data. google visualization api seems 开发者_运维技巧to expect its own json format. Is there any exiting js method/library to convert regular json objects to google visualization type of js objects? Thanks.

It really depends on what you're aiming for and what data looks like, and the google chart you want to use. I usually do the following when working with REST data and google charts.

In this example I use jQuery, but the js library you use isn't that relevant.

Say you've got the following set of data and what to show it in an areachart:

{"events":[{"event":{"timestamp":"1310926588423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926578423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926568423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926558423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926548423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926538423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926528423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926518423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926508423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}},{"event":{"timestamp":"1310926498423","service":"EsperEventProcessor.service","countAll3Sec_EsperEventProcessor":"0","server":"EsperServer"}}]}

To do this with JQuery and JSONQuery (which can help in easy selecting specific content in your JSON data) you can do something like this:

  // use the getJSON jQuery operation to get the REST data
  $.getJSON(restURL, function(data) {

    // use jsonquery to get all the 'event's from the JSON data     
    var query1 = "..event";
    var rootEvent = JSONQuery(query1,data);

    // manually create a datatable and fill it in the required
    // way for this chart           
    var data2 = new google.visualization.DataTable();
    data2.addColumn('string', 'Number of queries / per 10 seconds');
    data2.addColumn('number', '# queries');

    // each row is added based on information from the json event
    // by simply iterating over the array
    data2.addRows(rootEvent.length);
    for (i = 0; i < rootEvent.length; i++) {
      var date = new Date(parseInt(rootEvent[i]['timestamp']));
      var hours = date.getHours();
      var minutes = date.getMinutes();
      var seconds = date.getSeconds();

      var time = '';
      if (hours < 10) time=time+'0'; time=time+hours+':';
      if (minutes < 10) time=time+'0'; time=time+minutes+':';
      if (seconds < 10) time=time+'0'; time=time+seconds;

      data2.setCell(i,0,time);
      data2.setCell(i,1,parseInt(rootEvent[i]['countAll3Sec_EsperEventProcessor']));
    }


    chart.draw(data2, {width: 400, height: 240, title: 'Requests per 10 seconds',
                       hAxis: {title: 'Time', titleTextStyle: {color: '#FF0000'}}
    });
 });