Google Charts API shows blank screen with $(document).ready method

Question

I\'ve got several functions that instantiate various charts using Google Charts API.

When I call them without jQuery\'s $(document).ready method, everything

Answer 1

According to the google visualization documentation you need to load the visual package(s) prior to onload or jquery ready. I would suggest loading immediately after the jsapi script reference as shown below.

Otherwise you will get a 1) google is not defined (reference error) or 2) if using ajax possibly a blank response & blank page with no errors.

load sequence: (using your example)

$(document).ready(function(){
    google.setOnLoadCallback(window.drawColumnChart1);
    google.setOnLoadCallback(window.drawColumnChart2);
    google.setOnLoadCallback(window.drawGeoChart);
});