谷歌日历图表日期弹出(工具提示)问题
Posted
技术标签:
【中文标题】谷歌日历图表日期弹出(工具提示)问题【英文标题】:Google calendar chart date popup(tool tip) issues 【发布时间】:2016-10-15 04:10:08 【问题描述】:当光标放在日历图表上时,日期应该像第二个附加图像一样弹出(如工具提示),在我的代码中它显示为图表下方的(参考第一个图),我希望我的输出如第二个图所示. 请指导我解决这个问题,下面是我的代码。
<script>
$.getScript("https://www.google.com/jsapi", function ()
google.load('visualization', '1.1' , 'callback': calenderchart, 'packages': ['calendar'] );
);
function calenderchart(data)
var dataTable = new google.visualization.DataTable();
dataTable.addColumn( type: 'date', id: 'Date' );
dataTable.addColumn( type: 'number', id: 'Won/Loss' );
dataTable.addRows([
[ new Date(2012, 3, 13), 37032 ],
[ new Date(2012, 3, 14), 38024 ],
[ new Date(2012, 3, 15), 38024 ],
[ new Date(2012, 3, 16), 38108 ],
[ new Date(2012, 3, 17), 38229 ],
// Many rows omitted for brevity.
[ new Date(2013, 9, 4), 38177 ],
[ new Date(2013, 9, 5), 38705 ],
[ new Date(2013, 9, 12), 38210 ],
[ new Date(2013, 9, 13), 38029 ],
[ new Date(2013, 9, 19), 38823 ],
[ new Date(2013, 9, 23), 38345 ],
[ new Date(2013, 9, 24), 38436 ],
[ new Date(2013, 9, 30), 38447 ]
]);
var chart = new google.visualization.Calendar(document.getElementById('calendar_basic'));
var options =
title: "",
tooltip: ishtml: true
;
chart.draw(dataTable, options);
</script>
<body>
<div id="calendar_basic" style="width: 1000px;"ng-init ='calanderchart()'></div>
</body>
【问题讨论】:
【参考方案1】:这里似乎工作正常,您可以分享更多内容吗?
您的页面上有任何 CSS 吗?
google.load('visualization', '1.1',
callback: function ()
var dataTable = new google.visualization.DataTable();
dataTable.addColumn( type: 'date', id: 'Date' );
dataTable.addColumn( type: 'number', id: 'Won/Loss' );
dataTable.addRows([
[ new Date(2012, 3, 13), 37032 ],
[ new Date(2012, 3, 14), 38024 ],
[ new Date(2012, 3, 15), 38024 ],
[ new Date(2012, 3, 16), 38108 ],
[ new Date(2012, 3, 17), 38229 ],
[ new Date(2013, 9, 4), 38177 ],
[ new Date(2013, 9, 5), 38705 ],
[ new Date(2013, 9, 12), 38210 ],
[ new Date(2013, 9, 13), 38029 ],
[ new Date(2013, 9, 19), 38823 ],
[ new Date(2013, 9, 23), 38345 ],
[ new Date(2013, 9, 24), 38436 ],
[ new Date(2013, 9, 30), 38447 ]
]);
var chart = new google.visualization.Calendar(document.getElementById('calendar_basic'));
chart.draw(dataTable,
tooltip: isHtml: true
);
,
packages: ['calendar']
);
<script src="https://www.google.com/jsapi"></script>
<div id="calendar_basic" style="width: 1000px;"></div>
【讨论】:
工作正常,使用此代码在此控制器上出现另一个图表时出错以上是关于谷歌日历图表日期弹出(工具提示)问题的主要内容,如果未能解决你的问题,请参考以下文章