地图悬停并点击 Google 地图

Question

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

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

Google 地图是否支持单独的悬停与点击？

Answer 1

确实如此。首先在地图上有 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
});