title: Google visualization undefined for setOnLoadCallback
body: <p>I am using Google Geocharts and following Google's documentation (<a href="https://developers.google.com/chart/interactive/docs/gallery/geochart?hl=en" rel="nofollow noreferrer">https://developers.google.com/chart/interactive/docs/gallery/geochart?hl=en</a>) to setup a chart like this:</p>
  
  <pre><code>google.charts.load('current', {'packages':['geochart']});
  google.setOnLoadCallback(drawRegionsMap);
  
  function drawRegionsMap() {
  
   ...
    var data = google.visualization.arrayToDataTable(a1);
    var options = {};
  
    var chart = new google.visualization.GeoChart(document.getElementById('div_geochart'));
  
    chart.draw(data, options);
  };
  </code></pre>
  
  <p>array <strong>a1</strong> is defined globally. The script include lines are present in the header. The problem is, sometimes, I get an error saying: </p>
  
  <p><code>Uncaught TypeError: Cannot read property 'arrayToDataTable' of undefined</code></p>
  
  <p>and the chart doesn't load. The real problem is that it's hard to pinpoint the problem since it doesn't happen always. It seems that sometimes the google.visualization hasn't as yet been set up? But isn't the whole point of calling <em>drawRegionsMap</em> using <em>setOnLoadCallback</em> that, it will be called after google.visualization has been successfully set up?</p>
  
  <p>I did try changing the location of the <em>setOnLoadCallback</em> lines as mentioned here: <a href="https://stackoverflow.com/questions/23491461/google-visualization-typeerror-cannot-read-property-datatable-of-undefined">Google Visualization - TypeError: Cannot read property &#39;DataTable&#39; of undefined [Chrome specific]</a>. I also put those 2 lines in the <code>&lt;head&gt;</code> section of the page but the error still occurs sometimes (tested in Chrome and IE).</p>
  
  <p>Could someone give me pointers as to how to avoid getting this error?</p>