嘿，我下面有一个Google饼图的代码，该代码从jsontable中获取数据，我想当我单击一个切片以根据选择重新绘制图表时。
我有下面的代码，我不知所措
<head>
<style>
div.absolute {
position: absolute;
top: 120px;
}
</style>
<link href="style.css" rel="stylesheet" />
<!--Auto refresh code -->
<meta http-equiv="refresh" content="<?php echo $sec?>;URL='<?php echo $page?>'">
<!--Load the Ajax API-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://www.google.com/jsapi"></script>
<script src="http://www.google.com/jsapi?ext.js"></script>
<script src="https://rawgit.com/louisremi/jquery-smartresize/master/jquery.throttledresize.js"></script>
<script>
google.load('visualization', '1', {'packages':['corechart']});
google.setOnLoadCallback(initChart);
$(window).on("throttledresize", function (event) {
initChart();
});
function initChart() {
var options = {
title: 'Arrived Today (Email)',
width: '100%',
height: '100%',
sliceVisibilityThreshold: 0,
pieSliceText: 'percentage',
pieStartAngle: 100,
//is3D: 'true',
pieHole: 0.3,
slices: {
1: {offset: 0.2},
2: {offset: 0.3},
3: {offset: 0.4},
4: {offset: 0.5},
5: {offset: 0.6},
},
//slices: {0: {color: 'green'}, 1: {color: 'blue'}},
pieSliceBorderColor: 'black',
legend: 'right',
legendTextStyle: {fontSize: 15},
pieSliceText: 'value' ,
titleTextStyle: {
color: '333333',
fontName: 'Arial',
fontSize: 14 ,
align:'right'
},
chartArea : { left: 35 }
};
var data = new google.visualization.DataTable(<?=$jsonTable?>);
var data2 = new google.visualization.DataTable(<?=$jsonTable2?>);
var total = google.visualization.data.group(data,
[{
type: 'boolean',
column: 0,
modifier: function () {return true;}
}],
[{
type: 'number',
column: 1,
aggregation: google.visualization.data.sum
}]
);
document.getElementById("demo").innerHTML =total.getValue(0,1);
data.addRow(['Total: ' + total.getValue(0, 1), 0]);
drawChart(data, options)
}
function drawChart(data, options) {
var chart = new google.visualization.PieChart(document.getElementById('chart'));
chart.draw(data, options);
google.visualization.events.addListener(chart, 'select', selectHandler);
var label1 = data.pieSliceText('label');
// The selection handler.
// Loop through all items in the selection and concatenate
// a single message from all of them.
function selectHandler() {
var selection = chart.getSelection();
if (selection.length) {
var pieSliceLabel = data.getValue(selection[0].row, 0);
if (pieSliceLabel = 'External')
chart.draw(data2, options);
}
}
}
</script>
</head>
<body>
<h2 align="right"><font size="5">emails Arrived Today</font>
<div id="demo"></div>
</h2>
<div id="chart"></div>
</body>
在此先感谢您的帮助:)
最佳答案
function initChart() {
....
var data = new google.visualization.DataTable(<?=$jsonTable?>);
var data2 = new google.visualization.DataTable(<?=$jsonTable2?>);
....
}
function drawChart(data, options) {
google.visualization.events.addListener(chart, 'select', selectHandler);
function selectHandler() {
var selection = chart.getSelection();
if (selection.length) {
var pieSliceLabel = data.getValue(selection[0].row, 0);
if (pieSliceLabel = 'External')
chart.draw(data2, options);
}
}
}
除了变量data2的范围之外，其他所有内容都看起来不错。
您可以在函数
initChart()中启动它，然后尝试在drawChart()的子函数中使用它。您可以在任何javascript函数之外定义
var data2，或者在调用drawChart时将其作为参数传递。