在地图之外触发Google GeoChart工具提示

时间:2013-12-22 01:17:26

标签: google-visualization

我希望从geochart之外显示一个国家/地区的工具提示。我已经搜索了API,但我没有看到这样做的方法。

<script>
google.load('visualization', '1', { packages: ['geochart'] });

google.setOnLoadCallback(function()
{
    var data = google.visualization.arrayToDataTable([
        ["Country","Count"],
        ["Mexico",600],
        ["Canada",400]
    ]);

    new google.visualization.GeoChart(document.getElementById('map')).draw(data);
});
</script>

<div id="map" style="width: 500px; height: 300px;"></div>

<ul>
    <li><a href="#">Canada</a></li>
    <li><a href="#">Mexico</a></li>
</ul>
<p>Is there a way to trigger the map tooltips when hovering over the links above?</p>

Here's a very basic fiddle to start with

1 个答案:

答案 0 :(得分:2)

您可以为以下定义的Google Chart Tooltips覆盖样式:

http://ajax.googleapis.com/ajax/static/modules/gviz/1.0/core/tooltip.css

使用例如:

<style>
.google-visualization-tooltip {
    border: dashed 1px !important;
    position: fixed !important;
    top: 30px !important;
    right: 250px !important;
    margin: 10px 0 0 400px !important;
}
</style>

工具提示将浮动在图表的右侧。