Question

我想在我的地图中隐藏一组标记，并且我每10秒重新加载所有标记问题，每次重新加载标记时，所有隐藏标记都会显示出来。我使用复选框隐藏多种标记。

var markerGroups = {
            "Fire": [],
            "Flood": [],
            "Terrorism  ": [],
            "station": []
           };


setInterval(reload,10000);
function createMarker(map){
    var type;
    for (var i = 0; i < _newPointA['point'].length; i++) {
         type = _newPointA['type'][i];
        var icon = customIcons[type] || {};
        var myLatLng = new google.maps.LatLng(_newPointA['lat'][i],_newPointA['long'][i]);
        var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon :icon.icon
    });
        newMarker.push(marker);
        bindInfoWindow(marker,map,infoWindow, _newPointA['html'][i]);
        if (!markerGroups[type]){
                markerGroups[type] = [];
            }
        markerGroups[type].push(marker);

        }       

  }


function toggleGroup(type) {
        for (var i = 0; i < markerGroups[type].length; i++) {
            var toggle_marker = markerGroups[type][i];
                if (!toggle_marker.getVisible()) {
                    toggle_marker.setVisible(true);
                } else {
                    toggle_marker.setVisible(false);
                }
            }
    }
function reload(){
    for (var i=0; i<newMarker.length; i++) {

    newMarker[i].setMap(null);
    }

   // Reset the markers array
   newMarker = [];

   // Call set markers to re-add markers
   createMarker(map);

}

我的html中的toogleGroup

<table id = "legend_table">
                    <tr>
                        <th style = "width:20px;"></th>
                        <th style = "width:100px;"></th>
                    </tr>
                    <tr>
                        <td><input type ="checkbox" name = "fire_checkbox" onClick="toggleGroup('Fire')" checked = "checked"/></td>
                        <td><img src="img/Markers/fire.png"> Fire </td>
                    </tr>
                    <tr>
                        <td><input type = "checkbox" name = "flood_checkbox" onClick="toggleGroup('Flood')" checked = "checked"/></td>
                        <td><img src="img/Markers/flood.png"> Flood </td>
                    </tr>
                    <tr>
                        <td><input type = "checkbox" name = "terror_checkbox" onClick="toggleGroup('Terrorism')" checked = "checked"/></td>
                        <td><img src="img/Markers/terrorism.png"> Terrorism </td>
                    </tr>

                </table>

Answer 1

您需要做的是跟踪隐藏和显示哪些类别。在这里，我扩展了您的markerGroups以包含一个布尔值，您可以在切换复选框时更新该值。然后每次重新加载标记时，根据其状态设置每个标记的可见属性。

var ret = str.includes('one');

谷歌地图：隐藏标记组

1 个答案: