我有一个谷歌图表(使用谷歌可视化API,而不是谷歌图表API)填充页面加载.之后,用户可以从多个下拉菜单中选择选项.我希望用户能够根据他们的选择更新Google Chart.
我已经创建了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, …Run Code Online (Sandbox Code Playgroud) 我有三个我用json编码的PHP数组...因为数组工作正常而省略了额外的PHP代码....此外,为简洁起见,省略了调用谷歌图表的HTML标记...
<?php
$encoded_line_volume = json_encode($LineVol) . "\n";
$encoded_loan_volume = json_encode($LoanVol) . "\n";
$encoded_cluster_name = json_encode($ClusterLine) . "\n";
?>
Run Code Online (Sandbox Code Playgroud)
我想在Javascript中访问这三个数组来动态更新我的Google Chart.
<script type="text/javascript">
google.load("visualization", "1", {packages:["columnchart"]});
google.setOnLoadCallback(drawChart);
var linevol = new Array; // This would be the first array passed from PHP
var loanvol = new Array; // This would be the second array passed from PHP
var clusters = new Array; // This would be the third array passed from PHP
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', …Run Code Online (Sandbox Code Playgroud)