Question

我正在尝试制作谷歌地图项目，我在地图上显示我的标记。但是现在我想在单击复选框时显示/隐藏标记

这是我的代码，用于在我的地图中显示标记，我从MySQL获得的数据，

function initialize() { 
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 18,
          center: (lat,long)
        });

        var infowindow = new google.maps.InfoWindow({});


        var latArea = new Array();

        var longArea = new Array();

        for (i = 0; i < $$; i++) //looping until all data from mysql
        {  
            marker = new google.maps.Marker({

                position: new google.maps.LatLng(latArea[i], longArea[i]),
                map: map
            });


            google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infowindow.setContent('<b>Coordinat : </b>'+String(latArea[i])+' , '+
                                      String(longArea[i]));
                infowindow.open(map, marker);
                }
            })(marker, i));
        }
  }

我成功地将所有数据显示到地图中的标记并为隐藏/显示标记添加功能但是只有一个标记隐藏/显示不是全部，这是我的显示/隐藏功能代码

function toggleMarker() {
        if (!marker.getVisible()) {
            marker.setVisible(true);
        } else {
            marker.setVisible(false);
        }
  }

谢谢。

我正在解决这个问题，这是正确的代码，

<script>
  var markers = new Array();
  function initialize() {

        var latArea = new Array();

        var longArea = new Array();

        var i, newMarker;

        for (i = 0; i < $$; i++) 
        { 
            newMarker = new google.maps.Marker({
                position: new google.maps.LatLng(latArea[i], longArea[i]),
                map: map,
                icon: icon,

            newMarker.category = 'show';
            newMarker.setVisible(false);

            markers.push(newMarker);

        }

  }

  function displayMarkers(obj,category) {
      var i;

      for (i = 0; i < $$; i++)
         {   
            if (markers[i].category === category) {
                if ($(obj).is(":checked")) {
                    markers[i].setVisible(true);
                } else {
                    markers[i].setVisible(false);    
                }
            } else {
                markers[i].setVisible(false);
            }
         }
  }

和html中的此复选框用于显示/隐藏标记

<input type="checkbox" onclick="displayMarkers(this,'area');" />

标记谷歌地图显示/隐藏OnClick

0 个答案: