选择链接或复选框以显示类别标记 [英] Select Link or Checkbox to Display Category Markers

问题描述

我有一个示例映射

calwestcultural.com/sgs/backup/example-map.htmlrel =nofollow> http://calwestcultural.com/sgs/backup/example-map.html ，我在我的快捷菜单中有类别左边。我希望这些类别是可点击的，并只显示该类别的标记。

我想要：
1.隐藏加载时的标记
2.当你点击一个类别（例如吃，银行等），我只希望该类别中的标记显示

* if在菜单中创建一个复选框使得这更容易，我愿意这样做。我只是挂在我的地图的这一部分，需要继续前进。

任何人都可以帮助吗？有些东西告诉我这是一个简单的解决方法。

解决方案

如果您想将标记保存在不同的类别中，请为每个类别创建一个数组标记类别并用它们来存储每组标记。然后执行以下操作：

要在加载时隐藏标记，创建标记但将标记贴图属性设置为 null ：

  var myLatlng = new google.maps.LatLng（-25.363882,131.044922）; 
 var myOptions = {
 zoom：4，
 center：myLatlng，$ b $ mapTypeId：google.maps.MapTypeId.ROADMAP 
}; 
 var map = new google.maps.Map（document.getElementById（map_canvas），myOptions）; 
 var marker = new google.maps.Marker（{
 position：myLatlng，
 map：null，
 title：Hello World！
}）; 
  

要仅显示给定类别中的标记，请监听应该触发显示标记的事件然后设置标记的地图属性：

  for（var i = 0; i< markerCategoryArray.length; i ++）{ 
 markerCategoryArray [i] .setMap（map）; 
} 
  

I am somewhat stuck at trying to tell Javascript to do what I want it to do.

I have an example map http://calwestcultural.com/sgs/backup/example-map.html and I have categories in my spry menu to the left. I would like those categories to be clickable and reveal only markers for that category.

I'd like to: 1. Hide Markers on load 2. When you click on a category (for example "eat" "banks" etc) I'd like ONLY for the markers within that category to show

*if creating a checkbox within the menu makes this easier, i am willing to do that. I am just hung up on this part of my map and need to move on.

CAN ANYONE PLEASE HELP? Something tells me this is an easy fix.

解决方案

If you would like to keep markers in separate categories, create an array for each category of marker and use them to store each set of markers. Then do the following:

To hide markers on load, create the markers but leave the marker map property set to null:

var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var myOptions = {
    zoom: 4,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
    position: myLatlng,
    map: null,
    title:"Hello World!"
});

To show only the markers in a given category, listen for the event that should trigger display of the markers and then set the markers' map property:

for ( var i = 0; i < markerCategoryArray.length; i++ ) {
    markerCategoryArray[i].setMap( map );
}

这篇关于选择链接或复选框以显示类别标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！