google pie chart loading after ajax loads

I've been using the google pie chart and jquery Ajax.Load()

My problem is the pie chart loads only after the ajax load calls return, which is quite missing the point, of 开发者_JS百科letting the page load(including the chart), and then async loading of heavy content.

http://code.google.com/apis/chart/interactive/docs/gallery/piechart.html

The pie chart is loaded by:

google.setOnLoadCallback(drawChart);

and the Ajax calls are like:

$("#id").load(url, function(response, status, xhr) {
  if (status == "error") {
    alert(xhr.status + " " + xhr.statusText);
  }
  else {
      $("#id").show(); 
  }
});

how could i make the google pie chart loading happen before the ajax loads finish?

Why don't you execute the below code in drawChart method which is actually a callback method for drawing charts

$("#id").load(url, function(response, status, xhr) {
  if (status == "error") {
    alert(xhr.status + " " + xhr.statusText);
  }
  else {
      $("#id").show(); 
  }
});