您可以使用“选择”事件来执行此操作，每次用户单击折线图上的点时都会触发该事件。我在下面提供了一个工作示例，其中包括带有几个值的重定向。 Google 代码游乐场有一个如何在表上使用事件处理程序的好示例 http://code.google.com/apis/ajax/playground/?type=visualization#select_event- 大多数可视化可以使用相同类型的功能。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1.1', {packages: ['barchart']});
</script>
<script type="text/javascript">
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');
data.addColumn('number', 'Expenses');
data.addRows(4);
data.setValue(0, 0, '2004');
data.setValue(0, 1, 1000);
data.setValue(0, 2, 400);
data.setValue(1, 0, '2005');
data.setValue(1, 1, 1170);
data.setValue(1, 2, 460);
data.setValue(2, 0, '2006');
data.setValue(2, 1, 660);
data.setValue(2, 2, 1120);
data.setValue(3, 0, '2007');
data.setValue(3, 1, 1030);
data.setValue(3, 2, 540);
chart = new google.visualization.LineChart(document.getElementById('visualization'));
chart.draw(data, {width: 400, height: 240, title: 'Company Performance',
vAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
});
// a click handler which grabs some values then redirects the page
google.visualization.events.addListener(chart, 'select', function() {
// grab a few details before redirecting
var selection = chart.getSelection();
var row = selection[0].row;
var col = selection[0].column;
var year = data.getValue(row, 0);
location.href = 'http://www.google.com?row=' + row + '&col=' + col + '&year=' + year;
});
}
google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body>
<div id="visualization" style="width: 600px; height: 400px;"></div>
</body>
</html>
