1

我在谷歌地图中有这些标记。我需要能够根据数组的“id”部分显示或隐藏它们，使用复选框来打开和关闭它们。

  var places = [  
  {  
    "title": "USA",  
    "description": "This is the united states",  
    "position": [ 39.639538,-104.414062 ],
    "id": "america"
  },  
  {  
    "title": "China",  
    "description": "This is the peoples republic of china",  
    "position": [ 34.016242,103.359375 ],
    "id": "asia"  
  }
]

我已经使用 .each() 方法显示了标记，并且我尝试使用下面的 jquery 根据它们的 id 打开和关闭它们，但标记似乎忽略了它。任何帮助将不胜感激。

 var showAmerica = $("#showAmerica");
    google.maps.event.addDOMListener(showAmerica, 'click', function(){
        $('#america').toggle();
});

复选框的 HTML

<input type="checkbox" value="fund" id="showAmerica" />
4

2 回答 2

1

这个“id”属性是什么？MarkerOptions不包含它。

无论如何，要与 Google Maps 对象交互，您需要通过 gMaps API，而不是 jQuery。

例如，这里有一些代码，完全未经测试，但它应该给你一个想法：

var markers = {
    "america" : [ new google.maps.Marker({ "display": false, "position": .... }) ],
    "china" : [ new google.maps.Marker({ "display": false, "position": ... }) ]
};

$('#americaButton').click(function () {
     for (var i = 0; i< markers["america"].length; i++)
         markers["america"][i].setDisplay(true);
});
于 2012-05-16T11:55:06.963 回答
1

您的代码引用的是 jQuery 对象，而不是 DOM 元素。很容易获得实际的 DOM 元素，这是 DOM 侦听器期望的参数。只需.get(0)在第一个参数中添加 showAmerica 变量：

var showAmerica = $("#showAmerica");
    google.maps.event.addDOMListener(showAmerica.get(0), 'click', function(){
        $('#america').toggle();
});

此外，建议您观看有关将 DevTools 与 Google Maps API 结合使用的视频。

于 2012-05-16T17:34:22.563 回答