我有一个在页面加载时填充的 Google Chart(使用Google Visualization API,而不是Google Charts API )。之后,用户可以从多个下拉菜单中选择选项。我希望用户能够根据他们的选择更新谷歌图表。
我已经创建了 PHP 代码来通过 MySQL 获取新数据 - 在用户选择各种选项之后。
问题:我是否需要替换当前图表?还是我应该创建一个 JavaScript 函数来更新图表?
这是我的 Google Chart 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'
});
}