google.visualization.drawChart JSON response object options?

[Thijs Alberts]

Hello please consider this:

function myCallback() {

 callback = google.visualization.drawChart({

   containerId: <containerId>,

   dataSourceUrl: <url>,

   chartType: "...",

   options: <defined here>

 });

}

my data url returns a json literal object eg:

{

    data: {cols:..., rows:...}} //normal datatable in literal notation

    options: {chartOptions} // eg: title + subtitle etc based on query

}

Is it possible to merge options from the literal response with the options set in the callback?

[Ray Thomas]

It should be possible. You can turn both option objects into strings and manipulate them that way using JSON.stringify() to create a single set of options.

// Set chart options

var options = {'title':'How Much Pizza I Ate Last Night',

'width':400,

'height':300};

myStr = JSON.stringify(options);

alert( myStr);

Depending on how you are drawing your chart you can also try using setOption or setOptions in the chartWrapper methods documentation at https://developers.google.com/chart/interactive/docs/reference#methods_2   

Some time ago, before I really knew what I was doing, I wrote the page at https://www.indstate.edu/business/metrics

Here's part of the code from that to show the use of  setOption


theGraphs = new google.visualization.ChartWrapper({
chartType: userChart,
containerId: graphArea,
dataTable: myObject.datatable,
// These are options applied to all graphs
options: {
   height: 400,
   hAxis: {
      maxTextLines: 4, // maximum number of lines to wrap to
      maxAlternation: 4, // maximum layers of labels (setting this higher than 1 allows labels to stack over/under each other)
      minTextSpacing: 1, // minimum space in pixels between adjacent labels
   },
   textStyle: {
      fontSize: 9
   },
   legend: {
      position: "top",
      maxLines: 5
   },
   colors: usrClr
   }
});

// Add options for individual charts here
if (myObject.ID == "MSDC1" || myObject.ID == "MSDC2") {
theGraphs.setOption('hAxis.title', 'Figures are number of engaged students');
theGraphs.setOption('title', 'Figures are number of engaged students');
theGraphs.setOption('titleTextStyle.italic', true);
theGraphs.setOption('titleTextStyle.bold', false);