在Google地图上动态加载标记

Question

我想从Mysql数据库动态加载谷歌地图上的标记。应该出现地图中心20Km半径的标记，并且当地图中心被改变/平移时，位于20Km半径之外的旧标记应该消失，并且应该出现新中心20Km范围内的新标记。

现在我可以在地图中心20公里半径范围内加载标记，但只能打开一次网页。

任何暗示性教程或相同的帮助

Answer 1

1. 在地图对象上绑定center_changed事件侦听器。
2. 创建标记时，将它们推送到数组（按下每个标记对象）。
3. 在中心更改（＃1）上，循环标记数组并在每个标记上调用setMap(null)。
4. 使用新的中心坐标再次查询数据库。
5. 从＃2
再次执行每一步

这是一些快速代码，以便您明白：

// Create an array of markers
var markers = [];

// Create your map and all the stuff you need

// Bind the event listener
google.maps.event.addListener(map, 'center_changed', reloadMarkers);

// Function to reload the markers
function reloadMarkers() {

    for (var i = 0; i < markers.length; i++) {

        // Remove each marker from map
        markers[i].setMap(null);
    }

    createMarkers();
}

function createMarkers() {

    // Query your database with the parameters you need
    // Create each marker object (probably within a loop)

    var marker = new google.maps.Marker({
        map: map,
        // Your other marker properties here
    });

    // Push new marker to the markers array
    markers.push(marker);
}

希望这有帮助。