title: Google chart loading message
body: <p>I have the following script which works, but has one annoying issue:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script language="javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="http://www.google.com/jsapi"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChartAjax);
  
      function drawChartAjax() {
          $.ajax({ 
              url: 'chart_json.aspx', 
              type: 'POST', 
              dataType: 'json', 
              success: function(data) { 
                  drawChart(data); 
              } 
          });
      }
  
      function drawChart(json) {
          var data = new google.visualization.DataTable();
          data.addColumn('string', 'User');
          data.addColumn('number', 'v');
          data.addRows(json.length);
          for(var j in json) {
              for(var k in json[j]) {
                  data.setValue(parseInt(j), 0, k);
                  data.setValue(parseInt(j), 1, json[j][k].v);
              }
          }
          var chart = new google.visualization.PieChart( document.getElementById('chart_div') );
          chart.draw(data, {width: 500, height: 300, is3D: true, title: 'Titles goes here'});
      }
  &lt;/script&gt;
  &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="header"&gt;header goes ehre&lt;/div&gt;
      &lt;div id="chart_div"&gt;&lt;/div&gt;
      &lt;div id="footer"&gt;footer goes here&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The problem is that sometimes the chart can take a long time to appear for various reasons.  When this happens, the header loads, followed by the chart, followed by the footer.  This looks awful IMO.  IMO, the whole page should load, including the footer, and a flat "loading.." message should be displayed until the chart is ready to display itself, or an animated gif until the chart is ready.</p>
  
  <p>How can I get the whole page to load and display a loading message until the chart is ready, instead of having the footer missing, then the footer suddenly appears once the chart has finished loading?</p>