ajax 経由でフォームをページ (insert.php) に投稿すると、json 形式の応答が返されます。json レスポンスを使用して、Google の円グラフを読み込みたいと考えています。json 応答を新しい google.visualization.DataTable() に手動で貼り付けると、グラフが読み込まれますが、データを drawChart 関数 (以下) にフィードしようとしても何も起こりません。エラーメッセージは表示されません。
これが正しいアプローチであるかどうかはわかりません。
$(document).ready(function(){
$("#quiz").submit(function() { return false; });
$("#send").click(function(){
$.ajax({
type: 'POST',
url: "insert.php",
data : $("#quiz").serialize(),
dataType: "json",
success: function(jsonData){
drawChart(jsonData);
}
})
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['corechart']});
function drawChart(jsonData) {
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable();
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240});
}
});
});