javascript - jQueryUIタブでAjaxを介してGoogleコアチャートをロードする

Question

jQueryUIタブでAJAXを介してGoogleビジュアライゼーションをロードする

上記のリンクは私が持っている同様の疑問です。最初にajaxでjqueryuiタブを使用してgoogleVisualizationコアチャートを使用する必要があります。すべてが機能していませんでした。同じ問題がありましたが、リンクで提供されるソリューションでは部分的に機能しました。視覚化チャートの場合、その例では提供されますが、縦棒グラフまたは円グラフであるコアグラフでは提供されませんが、これらのグラフとは異なることがあります。

インデックスページにはこのスクリプトが含まれています

<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="js/jquery-ui.js"></script>
<script type='text/javascript' src='http://www.google.com/jsapi'></script> 
$(function() {
$("#switch").tabs({
    beforeLoad: function( event, ui ) {
        ui.jqXHR.error(function() {
            ui.panel.html(
                "Couldn't load this tab. We'll try to fix this as soon as possible. " +     "If this wouldn't be a demo."
            );
        });
    }
});
}); //for swicthes  
google.load("visualization", "1", {packages:["corechart"]});

そしてajaxページには

<script type='text/javascript'>
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
  ['Year', 'Sales', 'Expenses'],
  ['2004',  1000,      400],
  ['2005',  1170,      460],
  ['2006',  660,       1120],
  ['2007',  1030,      540]
]);

var options = {
  title: 'Company Performance',
  hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
};

var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>

表示するdiv-

<div id='chart_div' style='width: 700px; height: 240px;'></div>