谷歌地图链接到d3图表

时间:2016-09-12 11:16:55

标签: google-maps d3.js tooltip

在我的页面上,我有一张Google地图和一张条形图,使用d3绘制。当我将鼠标悬停在条形图上时,不透明度会发生变化,并显示工具提示。我试图做的是同样的事情,但是从地图中触发它。因此,当您将鼠标悬停在地图中的标记上时,条形图中的相应条形将突出显示(即不透明度更改并显示工具提示)。

在我的条形图中,我已经调用了提示功能,如下所示,但我不知道如何从地图标记中触发此功能?

tip = d3.tip()
.attr('class', 'd3-tip')
.offset([-10, 0])
.html(function(d) {
return hrTip(d);
})

有没有人在遇到这个问题之前?

1 个答案:

答案 0 :(得分:0)

Marker类支持一系列事件:

https://developers.google.com/maps/documentation/javascript/reference#Marker

您可以使用google.maps.event.addListener()函数为标记添加侦听器。

https://developers.google.com/maps/documentation/javascript/reference#event

E.g。

google.maps.event.addListener(marker, 'mouseover', function (event) {
    //Implement your logic here
});
google.maps.event.addListener(marker, 'mouseout', function (event) {
    //Implement your logic here
});