Google Map API-删除标记
我曾尝试在此处和Google Maps API文档中查看大量代码块，但仍无法弄清楚如何隐藏标记。
这是我正在使用的当前代码，并且可以在一个实例上使用。一旦我用markers.setMap（null）在函数中添加了“ for”循环，Firefox就会显示以下错误：
错误：TypeError：markers.setMap不是函数
function removeMarkers(){
var markers;
alert(markers);
alert(locations.length);
for (i = 0; i<locations.length; i++){
markers = locations[i];
alert(markers.title);
markers.setMap(null);
}
}
摇曳的蔷薇浏览 634回答 3
3回答
-
慕村225694
您需要保留一个google.maps.Marker对象数组以隐藏（或对其进行删除或运行其他操作）。在全球范围内：var gmarkers = [];然后在创建标记时将标记推入该阵列：var marker = new google.maps.Marker({ position: new google.maps.LatLng(locations[i].latitude, locations[i].longitude), title: locations[i].title, icon: icon, map:map});// Push your newly created marker into the array:gmarkers.push(marker);然后删除它们：function removeMarkers(){ for(i=0; i<gmarkers.length; i++){ gmarkers[i].setMap(null); }}工作示例（切换标记）代码段：var gmarkers = [];var RoseHulman = new google.maps.LatLng(39.483558, -87.324593);var styles = [{ stylers: [{ hue: "black" }, { saturation: -90 }]}, { featureType: "road", elementType: "geometry", stylers: [{ lightness: 100 }, { visibility: "simplified" }]}, { featureType: "road", elementType: "labels", stylers: [{ visibility: "on" }]}];var styledMap = new google.maps.StyledMapType(styles, { name: "Campus"});var mapOptions = { center: RoseHulman, zoom: 15, mapTypeControl: true, zoomControl: true, zoomControlOptions: { style: google.maps.ZoomControlStyle.SMALL }, mapTypeControlOptions: { mapTypeIds: ['map_style', google.maps.MapTypeId.HYBRID], style: google.maps.MapTypeControlStyle.DROPDOWN_MENU }, scrollwheel: false, streetViewControl: true,};var map = new google.maps.Map(document.getElementById('map'), mapOptions);map.mapTypes.set('map_style', styledMap);map.setMapTypeId('map_style');var infowindow = new google.maps.InfoWindow({ maxWidth: 300, infoBoxClearance: new google.maps.Size(1, 1), disableAutoPan: false});var marker, i, icon, image;var locations = [{ "id": "1", "category": "6", "campus_location": "F2", "title": "Alpha Tau Omega Fraternity", "description": "<p>Alpha Tau Omega house</p>", "longitude": "-87.321133", "latitude": "39.484092"}, { "id": "2", "category": "6", "campus_location": "B2", "title": "Apartment Commons", "description": "<p>The commons area of the apartment-style residential complex</p>", "longitude": "-87.329282", "latitude": "39.483599"}, { "id": "3", "category": "6", "campus_location": "B2", "title": "Apartment East", "description": "<p>Apartment East</p>", "longitude": "-87.328809", "latitude": "39.483748"}, { "id": "4", "category": "6", "campus_location": "B2", "title": "Apartment West", "description": "<p>Apartment West</p>", "longitude": "-87.329732", "latitude": "39.483429"}, { "id": "5", "category": "6", "campus_location": "C2", "title": "Baur-Sames-Bogart (BSB) Hall", "description": "<p>Baur-Sames-Bogart Hall</p>", "longitude": "-87.325714", "latitude": "39.482382"}, { "id": "6", "category": "6", "campus_location": "D3", "title": "Blumberg Hall", "description": "<p>Blumberg Hall</p>", "longitude": "-87.328321", "latitude": "39.483388"}, { "id": "7", "category": "1", "campus_location": "E1", "title": "The Branam Innovation Center", "description": "<p>The Branam Innovation Center</p>", "longitude": "-87.322614", "latitude": "39.48494"}, { "id": "8", "category": "6", "campus_location": "G3", "title": "Chi Omega Sorority", "description": "<p>Chi Omega house</p>", "longitude": "-87.319905", "latitude": "39.482071"}, { "id": "9", "category": "3", "campus_location": "D1", "title": "Cook Stadium/Phil Brown Field", "description": "<p>Cook Stadium at Phil Brown Field</p>", "longitude": "-87.325258", "latitude": "39.485007"}, { "id": "10", "category": "1", "campus_location": "D2", "title": "Crapo Hall", "description": "<p>Crapo Hall</p>", "longitude": "-87.324368", "latitude": "39.483709"}, { "id": "11", "category": "6", "campus_location": "G3", "title": "Delta Delta Delta Sorority", "description": "<p>Delta Delta Delta</p>", "longitude": "-87.317477", "latitude": "39.482951"}, { "id": "12", "category": "6", "campus_location": "D2", "title": "Deming Hall", "description": "<p>Deming Hall</p>", "longitude": "-87.325822", "latitude": "39.483421"}, { "id": "13", "category": "5", "campus_location": "F1", "title": "Facilities Operations", "description": "<p>Facilities Operations</p>", "longitude": "-87.321782", "latitude": "39.484916"}, { "id": "14", "category": "2", "campus_location": "E3", "title": "Flame of the Millennium", "description": "<p>Flame of Millennium sculpture</p>", "longitude": "-87.323306", "latitude": "39.481978"}, { "id": "15", "category": "5", "campus_location": "E2", "title": "Hadley Hall", "description": "<p>Hadley Hall</p>", "longitude": "-87.324046", "latitude": "39.482887"}, { "id": "16", "category": "2", "campus_location": "F2", "title": "Hatfield Hall", "description": "<p>Hatfield Hall</p>", "longitude": "-87.322340", "latitude": "39.482146"}, { "id": "17", "category": "6", "campus_location": "C2", "title": "Hulman Memorial Union", "description": "<p>Hulman Memorial Union</p>", "longitude": "-87.32698", "latitude": "39.483574"}, { "id": "18", "category": "1", "campus_location": "E2", "title": "John T. Myers Center for Technological Research with Industry", "description": "<p>John T. Myers Center for Technological Research With Industry</p>", "longitude": "-87.322984", "latitude": "39.484063"}, { "id": "19", "category": "6", "campus_location": "A2", "title": "Lakeside Hall", "description": "<p></p>", "longitude": "-87.330612", "latitude": "39.482804"}, { "id": "20", "category": "6", "campus_location": "F2", "title": "Lambda Chi Alpha Fraternity", "description": "<p>Lambda Chi Alpha</p>", "longitude": "-87.320999", "latitude": "39.48305"}, { "id": "21", "category": "1", "campus_location": "D2", "title": "Logan Library", "description": "<p>Logan Library</p>", "longitude": "-87.324851", "latitude": "39.483408"}, { "id": "22", "category": "6", "campus_location": "C2", "title": "Mees Hall", "description": "<p>Mees Hall</p>", "longitude": "-87.32778", "latitude": "39.483533"}, { "id": "23", "category": "1", "campus_location": "E2", "title": "Moench Hall", "description": "<p>Moench Hall</p>", "longitude": "-87.323695", "latitude": "39.483471"}, { "id": "24", "category": "1", "campus_location": "G4", "title": "Oakley Observatory", "description": "<p>Oakley Observatory</p>", "longitude": "-87.31616", "latitude": "39.483789"}, { "id": "25", "category": "1", "campus_location": "D2", "title": "Olin Hall and Olin Advanced Learning Center", "description": "<p>Olin Hall</p>", "longitude": "-87.324550", "latitude": "39.482796"}, { "id": "26", "category": "6", "campus_location": "C3", "title": "Percopo Hall", "description": "<p>Percopo Hall</p>", "longitude": "-87.328182", "latitude": "39.482121"}, { "id": "27", "category": "6", "campus_location": "G3", "title": "Public Safety Office", "description": "<p>The Office of Public Safety</p>", "longitude": "-87.320377", "latitude": "39.48191"}, { "id": "28", "category": "1", "campus_location": "E2", "title": "Rotz Mechanical Engineering Lab", "description": "<p>Rotz Lab</p>", "longitude": "-87.323247", "latitude": "39.483711"}, { "id": "28", "category": "6", "campus_location": "C2", "title": "Scharpenberg Hall", "description": "<p>Scharpenberg Hall</p>", "longitude": "-87.328139", "latitude": "39.483582"}, { "id": "29", "category": "6", "campus_location": "G2", "title": "Sigma Nu Fraternity", "description": "<p>The Sigma Nu house</p>", "longitude": "-87.31999", "latitude": "39.48374"}, { "id": "30", "category": "6", "campus_location": "E4", "title": "South Campus / Rose-Hulman Ventures", "description": "<p></p>", "longitude": "-87.330623", "latitude": "39.417646"}, { "id": "31", "category": "6", "campus_location": "C3", "title": "Speed Hall", "description": "<p>Speed Hall</p>", "longitude": "-87.326632", "latitude": "39.482121"}, { "id": "32", "category": "3", "campus_location": "C1", "title": "Sports and Recreation Center", "description": "<p></p>", "longitude": "-87.3272", "latitude": "39.484874"}, { "id": "33", "category": "6", "campus_location": "F2", "title": "Triangle Fraternity", "description": "<p>Triangle fraternity</p>", "longitude": "-87.32113", "latitude": "39.483659"}, { "id": "34", "category": "6", "campus_location": "B3", "title": "White Chapel", "description": "<p>The White Chapel</p>", "longitude": "-87.329367", "latitude": "39.482481"}, { "id": "35", "category": "6", "campus_location": "F2", "title": "Women's Fraternity Housing", "description": "", "image": "", "longitude": "-87.320753", "latitude": "39.482401"}, { "id": "36", "category": "3", "campus_location": "E1", "title": "Intramural Fields", "description": "<p></p>", "longitude": "-87.321267", "latitude": "39.485934"}, { "id": "37", "category": "3", "campus_location": "A3", "title": "James Rendel Soccer Field", "description": "<p></p>", "longitude": "-87.332135", "latitude": "39.480933"}, { "id": "38", "category": "3", "campus_location": "B2", "title": "Art Nehf Field", "description": "<p>Art Nehf Field</p>", "longitude": "-87.330923", "latitude": "39.48022"}, { "id": "39", "category": "3", "campus_location": "B2", "title": "Women's Softball Field", "description": "<p></p>", "longitude": "-87.329904", "latitude": "39.480278"}, { "id": "40", "category": "3", "campus_location": "D1", "title": "Joy Hulbert Tennis Courts", "description": "<p>The Joy Hulbert Outdoor Tennis Courts</p>", "longitude": "-87.323767", "latitude": "39.485595"}, { "id": "41", "category": "6", "campus_location": "B2", "title": "Speed Lake", "description": "", "image": "", "longitude": "-87.328134", "latitude": "39.482779"}, { "id": "42", "category": "5", "campus_location": "F1", "title": "Recycling Center", "description": "", "image": "", "longitude": "-87.320098", "latitude": "39.484593"}, { "id": "43", "category": "1", "campus_location": "F3", "title": "Army ROTC", "description": "", "image": "", "longitude": "-87.321342", "latitude": "39.481992"}, { "id": "44", "category": "2", "campus_location": " ", "title": "Self Made Man", "description": "", "image": "", "longitude": "-87.326272", "latitude": "39.484481"}, { "id": "P1", "category": "4", "title": "Percopo Parking", "description": "", "image": "", "longitude": "-87.328756", "latitude": "39.481587"}, { "id": "P2", "category": "4", "title": "Speed Parking", "description": "", "image": "", "longitude": "-87.327361", "latitude": "39.481694"}, { "id": "P3", "category": "4", "title": "Main Parking", "description": "", "image": "", "longitude": "-87.326245", "latitude": "39.481446"}, { "id": "P4", "category": "4", "title": "Lakeside Parking", "description": "", "image": "", "longitude": "-87.330848", "latitude": "39.483284"}, { "id": "P5", "category": "4", "title": "Hatfield Hall Parking", "description": "", "image": "", "longitude": "-87.321417", "latitude": "39.482398"}, { "id": "P6", "category": "4", "title": "Women's Fraternity Parking", "description": "", "image": "", "longitude": "-87.320977", "latitude": "39.482315"}, { "id": "P7", "category": "4", "title": "Myers and Facilities Parking", "description": "", "image": "", "longitude": "-87.322243", "latitude": "39.48417"}, { "id": "P8", "category": "4", "title": "", "description": "", "image": "", "longitude": "-87.323241", "latitude": "39.484758"}, { "id": "P9", "category": "4", "title": "", "description": "", "image": "", "longitude": "-87.323617", "latitude": "39.484311"}, { "id": "P10", "category": "4", "title": "", "description": "", "image": "", "longitude": "-87.325714", "latitude": "39.484584"}, { "id": "P11", "category": "4", "title": "", "description": "", "image": "", "longitude": "-87.32778", "latitude": "39.484145"}, { "id": "P12", "category": "4", "title": "", "description": "", "image": "", "longitude": "-87.329035", "latitude": "39.4848"}];for (i = 0; i < locations.length; i++) { var marker = new google.maps.Marker({ position: new google.maps.LatLng(locations[i].latitude, locations[i].longitude), title: locations[i].title, map: map }); gmarkers.push(marker); google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() { if (locations[i].description !== "" || locations[i].title !== "") { infowindow.setContent('<div class="content" id="content-' + locations[i].id + '" style="max-height:300px; font-size:12px;"><h3>' + locations[i].title + '</h3>' + '<hr class="grey" />' + hasImage(locations[i]) + locations[i].description) + '</div>'; infowindow.open(map, marker); } } })(marker, i));}function toggleMarkers() { for (i = 0; i < gmarkers.length; i++) { if (gmarkers[i].getMap() != null) gmarkers[i].setMap(null); else gmarkers[i].setMap(map); }}function hasImage(location) { return '';}html,body,#map { height: 100%; width: 100%;}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="http://maps.googleapis.com/maps/api/js"></script><div id="controls"> <input type="button" value="Toggle All Markers" onClick="toggleMarkers()" /></div><div id="map"></div> -
慕尼黑8549860
根据Google文档，他们说这是最好的方法。首先创建此函数以找出有多少个标记/ function setMapOnAll(map1) { for (var i = 0; i < markers.length; i++) { markers[i].setMap(map1); } }接下来创建另一个函数以消除所有这些标记 function clearMarker(){setMapOnAll(null);}然后创建此最终功能以在调用此功能时擦除所有标记。 function delateMarkers(){clearMarker()markers = []//console.log(markers) This is just if you want to}希望能帮助好运 -
慕盖茨4494581
你可以试试这个 markers[markers.length-1].setMap(null);希望它能工作。
随时随地看视频慕课网APP
API