json for histogram example?

[Ben Falchuk]

Does anyone have the JSON data that would have to be sent back to the client (ajax) in order to generate the histogram chart found in the example:

https://developers.google.com/chart/interactive/docs/gallery/histogram

..while still using arrayToDataTable as in the example?

thanks,
ben.

[Sergey Grabkovsky]

If you're using dates in your chart, then sending arrayToDataTable-compatible JSON is going to be difficult, if not impossible, since arrayToDataTable doesn't support the Date String representation. Other than that, you should just be able to send an array of arrays and pass that into arrayToDataTable, and everything should work exactly as expected. You might have to wrap it in something like {data: ... }, and pull that out after you get the JSON on the client-side.

Is there a specific problem you're having? Something that doesn't work? Do you have an example of data that you're sending that doesn't work that you're confused about?

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.

[Ben Falchuk]

When i use this (valid) XML :

{"cols":[{"id":"task", "type":"string"},{"id":"val", "type":"number"}],"rows": [{"task":"Work", "val":"1"},{"task":"study", "val":"5"},{"task":"eat", "val":"3"},{"task":"nap", "val":"1"}]}

i get client side error:  "Cannot read property '1' of undefined".

I thought maybe it is the quotes.. but i get the same above error when i try: 

{"cols":[{"id":"task", "type":"string"},{"id":"val", "type":"number"}],"rows": [{"task":"Work", "val":1}]}

My mainline processing code is:

    google.load('visualization', '1', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.

    google.setOnLoadCallback(drawChart);

    function drawChart() {

      var jsonData = $.ajax({

          url: "getjson.jsp",

          dataType:"json",

          async: false,

          legend:{position: 'labeled'}

          }).responseText;

          

      // Create our data table out of JSON data loaded from server.

      var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.

      var chart = new google.visualization.Histogram(document.getElementById('chart_div'));

      chart.draw(data, {width: 400, height: 240});

    }

    </script>

[Sergey Grabkovsky]

That's JSON, not XML; you're not using arrayToDataTable like you asked in your first question; and that's not the format that the DataTable takes in for its JSON.

You can find an example of valid JSON here: https://developers.google.com/chart/interactive/docs/reference

Your JSON should look like (formatted for clarity):

{

  "cols":[

    {"id": "task", "type": "string"},

    {"id": "val", "type": "number"}],

  "rows": [

    {"c": [{"v": "Work"}, {"v": 1}]},

    {"c": [{"v": "study"}, {"v": 5}]},

    {"c": [{"v": "eat"}, {"v": 3}]},

    {"c": [{"v": "nap"}, {"v": 1}]}

  ]

}

--

[Ben Falchuk]

Sergey thank you, this cleared it up. I was choking on the syntax around the rows ('c', 'v' and so on).  (apologies for accidental misdirection..)

To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.