10
ページロードに負担をかけるGoogleグラフ(Google Visualization APIではなく、Google Charts API)があります。その後、ユーザーは複数のドロップダウンメニューからオプションを選択できます。私は、ユーザーがその選択に基づいてGoogle Chartを更新できるようにしたいと思います。PHPとJavaScriptを使用してGoogle Chartを動的に更新する
私はすでに、MySQLを介して新しいデータを取得するためのPHPコードを作成しました。ユーザーがさまざまなオプションを選択した後です。
質問:現在のグラフを置き換える必要がありますか?グラフを更新するJavaScript関数を作成する必要がありますか?私はチャートを置き換えるのではなく、データを更新してしまう
google.load("visualization", "1", {packages:["columnchart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Cluster');
data.addColumn('number', 'Loans');
data.addColumn('number', 'Lines');
/* create for loops to add as many columns as necessary */
var len = (encoded_cluster_name.length)-27; // encoded_line_volume.length;
data.addRows(len);
for(i=0; i<len; i++) {
var lines = (encoded_line_volume[i])/100000;
var loans = (encoded_loan_volume[i])/100000;
data.setValue(i, 0, ' '+encoded_cluster_name[i]+' '); /* x-axis */
data.setValue(i, 1, loans); /* Y-axis category #1*/
data.setValue(i, 2, lines); /* Y-axis category #2*/
}
/*********************************end of loops*****/
var chart = new google.visualization.ColumnChart(
document.getElementById('chart_div'));
chart.draw(data, {
width: 600,
height: 300,
is3D: true,
title: 'Prospect Population',
legend: 'right'
});
}
dlamblin、私の質問に答えるための 感謝。私は1つ借りている! brussels0828 – brussels0828
あなたは大歓迎です。その遊び場リンクは、URLの#部分に_エンコードされていない(%5Fとして)存在している必要があります。しかし、投稿はマークダウンのためにフィルタリングされます。このコメントのリンクは機能するはずです:http://code.google.com/apis/ajax/playground/?type=visualization#column_chart – dlamblin
@dlamblin私はあなたのコードをプレイグラウンドに貼り付けてプレイしますが、実行しません何か...どんなアイデアですか?ハハ。 – Shackrock