地图悬停和点击谷歌地图

Question

Google 地图上的地图标记是否可以显示 3/4/5 等，从而使用户放大地图。是否可以添加不改变点击行为的“悬停”？

想象一下，您将鼠标悬停在地图上的 3 上，当您点击 3 时，会弹出一个显示目的地的窗口

Google 地图是否支持将悬停与点击分开？

Answer 1

确实如此。首先在 Map 本身有 mouseover 和 mousemove 事件，它们基本上做同样的事情：

https://developers.google.com/maps/documentation/javascript/reference/map

其次，如果您希望这仅发生在标记上，则在标记上还有 mouseover 和 mouseout 事件，当用户将鼠标悬停在标记上时，然后将光标移离标记

https://developers.google.com/maps/documentation/javascript/reference/marker

所以你可以做类似的事情

const map = new google.maps.Map(document.getElementById('map'), {
    zoom: 13,
    center: {lat: 51.476706, lng: 0},
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

const marker = new google.maps.Marker({
    map: map,
    position: {lat: 51.476706, lng: 0}
});


marker.addListener('mouseover', function() {
    // open your popup window
});

marker.addListener('mouseout', function() {
    // close your popup window
});