Ajax load of chart

Have noticed this issue as well, can't figure out why though.

I had this issue tonight and this is the line that needs to change:

open google_chart_tools.js and on line 12 change
google.setOnLoadCallback(drawChart);
google.setOnLoadCallback(drawChart, true);

That will tell google to load the function on DOM ready instead of Window Ready. Its late, I will get a patch in the morning.

Patch added.

Does anyone know if its possible to get this working via Views integration?
I'm trying to use exposed filters and finding that no chart will load on submit

Same problem as #4

I know that last response here was around a year ago, but anyway I've figured it out.

As exposed form submit fires an ajaxComplete event, you have to add a javascript handler for it. In order to avoid unpredictable bechavior, you have to specify selector that related to view, however, it will work even with 'body' selector.

	  $('#your-view-id').ajaxComplete(function(event, xhr, settings) { 
		 drawChart();
	  });    

place it in google_chart_tools.js

(function($) {
  Drupal.behaviors.googleChart = {
    attach: function(context, settings) {
   
   //existing attach code goes here
   ...
   //end of existing code

   //place your code here  
 }
}
})(jQuery);

Generally, using ajaxComplete handler allows to do anything with every exposed filter form submit, not just the charts.

I had the same issue as people mentioning above.
Have a view with exposed filters using block display and since this issue https://www.drupal.org/node/690748#comment-6664022

"Exposed filters will not appear on block displays unless 'Use Ajax' is set to TRUE"

The solution is in the patch attached to this issue in the comment #3
This is enough for solving the issue when you need to load a chart dynamically using AJAX eventually using Views.

Tested with latest Drupal, Views and Google Chart Tools

This solves the issue only partially. It will work only for the first reload using Ajax.

For some reason the solution of #3 worked for me in Chrome but not in FF. I was loading charts via ajax with ajaxblocks module. Anyhow, what worked for me was to replace setOnLoadCallback with specifying the callback in the load function. See attached patch. I didn't test it with the other cases mentioned above.

In porting Google Analytics Reports module it uses a custom ajax callback and render a chart. So what I did was change the javascript so could call drawCharts with the settings for that chart.

      $.ajax({
        url: Drupal.settings.googleAnalyticsReportsAjaxUrl + '/path-mini',
        dataType: 'json',
        data: ({ path: window.location.pathname + window.location.search }),
        success: function(data) {
          $('.google-analytics-reports-path-mini', context).html(data.content).hide().slideDown('fast');
          // Trigger drawing of the chart with the chart settings return by the ajax callback.
          GoogleChartTools.drawChart(data.settings);
        },
        error: function(data) {
          // @TODO
        }
      });

Uploaded the patch again following patch naming conventions.

Hello, I read a lot about the issues module, and I have a proposal.

the problem is that the module executes a merge of the information in the datatable. however the php contains the information you want to graph from the server. To avoid merge information, this data is sent to the js.

Performing several inspections, I added the following code after line 23 on google_chart_tools.module:

// Line 23
  drupal_add_js (drupal_get_path ('module', 'google_chart_tools') '/google_chart_tools.js.');

// Extra code
$ Key = array_keys ($ settings ["chart"]);
$ Num = (count ($ settings ["chart"] [$ key [0]] [header]));

//existing attach code goes here
   ...
//end of existing code

---------------------------------------------------------------------------------------------------------------
In google_chart_tools.js after the attach the following code:

// Line 12
attach: function (context, settings) {

// Extra Code,
var val_php = settings.google_chart_tools.val;
var key = settings.google_chart_tools.arr;
 google.setOnLoadCallback (drawChart, true);

//existing attach code goes here
...
//end of existing code

---------------------------------------------
And finally this, after this code:

var options = settings.chart [ChartID] .options;

// Extra code
if (key == settings.chart [ChartID] .containerId) {
var t_row = data.getNumberOfRows();
var rest = (t_row-val_php);
data.removeRows (val_php, rest);
}

//existing attach code goes here

...
//end of existing code
 

---------------------
note: the partial solution of google.setOnLoadCallback (drawChart, true); enables the graphic display after called by ajax. good!

I'm not good with grammar, sorry for this, I hope it's work for you, please comments.

Hi,
I found that, if we remove the google.setOnLoadCallback function, and just call the drawChart function it will work in ajax mode.
Looks like we need to check somehow if the google Visualization API is loaded.

patch #11 is working perfectly and solved mentioned issue.
https://github.com/govCMS/govCMS is using the same patch in prod env as well.