我想知道有没有人知道如何使用DataTable,addColumn和addRow将工具提示添加到Google Line Charts的多行数据？
我已经使用其他方法看到了这一点,但是这在我的项目中是相当困难的,我觉得没有弄清楚这一点.无论如何,我已经放弃了我的代码来介绍我的问题的要点.
如您所见,工具提示显示第2行,但不是第1行.我的问题是：如何使用此方法向第1行添加工具提示？
我的代码：
http://jsfiddle.net/Qquse/550/
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('number','y');
data.addColumn('number','Line 1');
data.addColumn('number','Line 2');
data.addColumn({type: 'string',role: 'tooltip'});
data.addRow([1,1,2,"Some fancy tooltip"]);
data.addRow([2,4,"Some fancy tooltip"]);
data.addRow([3,3,6,"Some fancy tooltip"]);
data.addRow([4,8,"Some fancy tooltip"]);
data.addRow([5,5,10,"Some fancy tooltip"]);
var options = {
title: 'Graph'
};
var chart = new google.visualization.LineChart(document.getElementById('chart'));
chart.draw(data,options);
}
google.load("visualization","1",{packages: ["corechart"]});
google.setOnLoadCallback(drawChart);
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>
解决方法
我尝试先添加DataColumns,然后再添加工具提示.原来它必须按照这个顺序：
data.addColumn('number','y');
data.addColumn('number','Line 1');
data.addColumn({type: 'string',role: 'tooltip'});
data.addColumn('number','Line 2');
data.addColumn({type: 'string',role: 'tooltip'});
代替
data.addColumn('number','Line 1');
data.addColumn('number',role: 'tooltip'});
data.addColumn({type: 'string',role: 'tooltip'});
更新工作小提琴：http://jsfiddle.net/Qquse/1207/
