按钮点击隐藏谷歌地图标记
Button click hide Google map markers
我写了下面的代码,当点击id = "showmarkers"的按钮时,它会在谷歌地图上显示标记。
我想发生的是,当再次单击相同的按钮时(或者当单击另一个按钮时,id ="隐藏标记"),标记将隐藏。
任何帮助将不胜感激,谢谢
$(document).ready(function() {
$("#map").css({
height: 500,
width: 600
});
var myLatLng = new google.maps.LatLng(51.50754,-0.127894);
MYMAP.init('#map', myLatLng, 13);
$("#showmarkers").click(function(e){
MYMAP.placeMarkers('markers.xml');
});
});
var MYMAP = {
map: null,
bounds: null
}
MYMAP.init = function(selector, latLng, zoom) {
var myOptions = {
zoom:zoom,
center: latLng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map($(selector)[0], myOptions);
this.bounds = new google.maps.LatLngBounds();
}
MYMAP.placeMarkers = function(filename) {
$.get(filename, function(xml){
$(xml).find("marker").each(function(){
var name = $(this).find('name').text();
var address = $(this).find('address').text();
var lat = $(this).find('lat').text();
var lng = $(this).find('lng').text();
var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));
MYMAP.bounds.extend(point);
var marker = new google.maps.Marker({
position: point,
map: MYMAP.map
});
var infoWindow = new google.maps.InfoWindow();
var html='<strong>'+name+'</strong.><br />'+address;
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(MYMAP.map, marker);
});
});
});
}
你可以有一个布尔标志'shouldHideMarkers'并检查它是否为真,所以隐藏它们,或者假,所以显示它们。请记住,如果要从地图中删除标记,则应将其 Map 属性设置为 null。最好的方法是将所有标记变量存储到一个数组中并遍历数组,以便将其映射属性设置为 null 以隐藏它们
相关文章:
- 如何更改角度谷歌地图上的集群图标
- 谷歌地图API-显示具有不同图标的标记
- 谷歌地图-更改图层图标大小
- 在地图加载/页面加载时,我想将地图设置为当前地理位置,但不想在地图上显示定位图标
- 将图标作为参数传递不会;t工作-谷歌地图
- 谷歌地图隐藏手图标
- 从谷歌地图信息窗口中删除关闭图标
- 在javascript中设置谷歌地图标记图标属性
- 我是否可以在单击特定图标时更改地图标记图标,然后在单击另一个图标时切换,等等
- 我如何才能在某些条件下更改c#中谷歌地图标记的图标
- 使用HTML元素代替gmap3的地图标记图标
- 使用jQuery下拉菜单更改谷歌地图图标
- 使用SVG文件动态修改谷歌地图图标
- 在Javascript中使用相对路径设置谷歌地图图标
- 使谷歌地图图标图像更小
- 自定义谷歌地图图标如果值>=1
- 谷歌地图图标赢得't显示
- 将自定义参数添加到谷歌地图图标中
- 使用精灵自定义谷歌地图图标
- 谷歌地图图标颜色