Wenn ich in Google Maps API v2 alle Kartenmarkierungen entfernen wollte, konnte ich das einfach tun:
map.clearOverlays();Wie mache ich das in Google Maps API v3 ?
Die Betrachtung der Referenz-API Das ist mir unklar.
Antworten
Zu viele Anzeigen?
Jirapong
Punkte
23524
In der neuen Version v3 wird empfohlen, die Daten in Arrays zu speichern. wie folgt.
Siehe Muster unter Overlay-Übersicht .
var map;
var markersArray = [];
function initialize() {
var haightAshbury = new google.maps.LatLng(37.7699298, -122.4469157);
var mapOptions = {
zoom: 12,
center: haightAshbury,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
google.maps.event.addListener(map, 'click', function(event) {
addMarker(event.latLng);
});
}
function addMarker(location) {
marker = new google.maps.Marker({
position: location,
map: map
});
markersArray.push(marker);
}
// Removes the overlays from the map, but keeps them in the array
function clearOverlays() {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
}
}
// Shows any overlays currently in the array
function showOverlays() {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(map);
}
}
}
// Deletes all markers in the array by removing references to them
function deleteOverlays() {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
markersArray.length = 0;
}
}
SphynxTech
Punkte
1719
Die Lösung ist ganz einfach. Sie können die Methode verwenden: marker.setMap(map); . Hier legen Sie fest, auf welcher Karte die Stecknadel erscheinen soll.
Wenn Sie also null in dieser Methode ( marker.setMap(null); ), wird die Stecknadel verschwinden.
Jetzt können Sie eine Funktion schreiben, die alle Markierungen in Ihrer Karte verschwinden lässt.
Man muss nur die Pins in ein Array packen und mit markers.push (your_new pin) oder zum Beispiel dieser Code:
// Adds a marker to the map and push to the array.
function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map
});
markers.push(marker);
}Dies ist eine Funktion, mit der Sie alle Marker Ihres Arrays in der Karte setzen oder verschwinden lassen können:
// Sets the map on all markers in the array.
function setMapOnAll(map) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(map);
}
}Um alle Ihre Markierungen verschwinden zu lassen, sollten Sie die Funktion mit null :
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
setMapOnAll(null);
}Um alle Markierungen zu entfernen und verschwinden zu lassen, sollten Sie Ihre Markierungsreihe wie folgt zurücksetzen:
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
markers = [];
}Dies ist mein vollständiger Code. Es ist das einfachste, auf das ich mich beschränken konnte. Voller Sorgfalt sein können Sie ersetzen YOUR_API_KEY im Code durch Ihren Schlüssel google API:
<!DOCTYPE html>
<html>
<head>
<title>Remove Markers</title>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<p>Click on the map to add markers.</p>
<script>
// In the following example, markers appear when the user clicks on the map.
// The markers are stored in an array.
// The user can then click an option to hide, show or delete the markers.
var map;
var markers = [];
function initMap() {
var haightAshbury = {lat: 37.769, lng: -122.446};
map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: haightAshbury,
mapTypeId: 'terrain'
});
// This event listener will call addMarker() when the map is clicked.
map.addListener('click', function(event) {
addMarker(event.latLng);
});
// Adds a marker at the center of the map.
addMarker(haightAshbury);
}
// Adds a marker to the map and push to the array.
function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
map: map
});
markers.push(marker);
}
// Sets the map on all markers in the array.
function setMapOnAll(map) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(map);
}
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
setMapOnAll(null);
}
// Shows any markers currently in the array.
function showMarkers() {
setMapOnAll(map);
}
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
markers = [];
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js key=YOUR_API_KEY&callback=initMap">
</script>
</body>
</html>Sie können konsultieren Google-Entwickler oder die vollständige Dokumentation auf, auch, Google-Entwickler-Website .
Adam Starrh
Punkte
5651
Nguoi Viet Nam
Punkte
61
jmbertucci
Punkte
8134
In der Demo-Galerie von Google finden Sie eine Demo, die zeigt, wie es geht:
http://code.google.com/apis/maps/documentation/javascript/examples/overlay-remove.html
Sie können sich den Quellcode ansehen, um zu sehen, wie sie Markierungen hinzufügen.
Lange Rede, kurzer Sinn: Sie speichern die Markierungen in einem globalen Array. Wenn sie gelöscht werden, durchlaufen sie das Array und rufen ".setMap(null)" für das jeweilige Markierungsobjekt auf.
Dieses Beispiel zeigt jedoch einen "Trick". "Löschen" bedeutet in diesem Beispiel, dass sie aus der Karte entfernt werden, aber im Array verbleiben, so dass die Anwendung sie schnell wieder in die Karte einfügen kann. In gewissem Sinne wirkt dies wie ein "Verstecken".
Mit "Löschen" wird das Feld ebenfalls gelöscht.
