Google Maps API {REMEDOVERLAY (Marker);} und {clearoverlays ();};

StackOverflow https://stackoverflow.com/questions/1843817

Frage

Ich habe ein Problem, die alten Marker zu entfernen, ohne den zentralen Punkt des Kreises "Es ist auch ein Marker" zu entfernen, ohne zu entfernen.

die Quelle ::::

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAA1XbMiDxx_BTCY2_FkPh06RRaGTYH6UMl8mADNa0YKuWNNa8VNxQEerTAUcfkyrr6OwBovxn7TDAH5Q"></script>
    <script type="text/javascript">
    //<![CDATA[
    var map;
var container;
var opacity = 0.4;
var circle;
var centerMarker;
var circleUnits;
var circleRadius;
var zoom = 2;
var centerPoint = new GLatLng(40,-100);
var laat;
var lnng;

    function load() {
      if (GBrowserIsCompatible()) {

        map = new GMap2(document.getElementById('map'),{draggableCursor:"crosshair"});
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(40, -100), 4);
      }
    }

function drawCircle() {
    var oUnitsMI = document.getElementById('unitsMI');
    var oUnitsKM = document.getElementById('unitsKM');
    var oRadius = document.getElementById('radiusInput');
    oRadius.value = oRadius.value ? oRadius.value : 500;

    if (oRadius.value.match(/[^\d.]/)) {
        alert("Don't be silly. Enter a number for radius");
        return;
    }
    if (oRadius.value > 9999) {
    }

    circleRadius = oRadius.value;

    if (oUnitsKM.checked) {
        circleUnits = 'KM';
    }
    else {
        circleUnits = 'MI';
    }

    doDrawCircle();
}


function doDrawCircle(){

    if (circle) {
        map.removeOverlay(circle);

    }


    if (centerMarker) {
    //map.removeOverlay(marker);
        map.setCenter(centerMarker.getLatLng())
    }
    else {
        centerMarker = new GMarker(map.getCenter(),{draggable:true});
        GEvent.addListener(centerMarker,'dragend',drawCircle)
        map.addOverlay(centerMarker);
    }

    var center = map.getCenter();

    var bounds = new GLatLngBounds();


    var circlePoints = Array();

    with (Math) {
        if (circleUnits == 'KM') {
            var d = circleRadius/6378.8;    // radians
        }
        else { //miles
            var d = circleRadius/3963.189;  // radians
        }
laat=center.lat();
lnng=center.lng();
        var lat1 = (PI/180)* center.lat(); // radians
        var lng1 = (PI/180)* center.lng(); // radians

        for (var a = 0 ; a < 361 ; a++ ) {
            var tc = (PI/180)*a;
            var y = asin(sin(lat1)*cos(d)+cos(lat1)*sin(d)*cos(tc));
            var dlng = atan2(sin(tc)*sin(d)*cos(lat1),cos(d)-sin(lat1)*sin(y));
            var x = ((lng1-dlng+PI) % (2*PI)) - PI ; // MOD function
            var point = new GLatLng(parseFloat(y*(180/PI)),parseFloat(x*(180/PI)));
            circlePoints.push(point);
            bounds.extend(point);
        }

        if (d < 1.5678565720686044) {
            circle = new GPolygon(circlePoints, '#000000', 2, 1, '#000000', 0.25);  
        }
        else {
            circle = new GPolygon(circlePoints, '#000000', 2, 1);   
        }
        map.addOverlay(circle); 

        map.setZoom(map.getBoundsZoomLevel(bounds)-2);
        searchLocationsNear(center);
    }
}

   function searchLocationsNear(center) {

     var radius = document.getElementById('radiusInput').value;
     var searchUrl = 'phpsqlsearch_genxml.php?lat=' + laat + '&lng=' + lnng + '&radius=' + radius;
     GDownloadUrl(searchUrl, function(data) {
       var xml = GXml.parse(data);
       var markers = xml.documentElement.getElementsByTagName('marker');
     if (marker) {
        map.removeOverlay(marker);

    }

//<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<


     //map.removeOverlay(marker);   /*how to remove the old markers without removing the central point mark. */
        //map.clearOverlays();


//<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

       var sidebar = document.getElementById('sidebar');
       sidebar.innerHTML = '';
       if (markers.length == 0) {
         sidebar.innerHTML = 'No results found.';
         map.setCenter(new GLatLng(40, -100), 4);
         return;
       }

       var bounds = new GLatLngBounds();
       for (var i = 0; i < markers.length; i++) {
         var name = markers[i].getAttribute('name');
         var address = markers[i].getAttribute('address');
         var distance = parseFloat(markers[i].getAttribute('distance'));
         var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
                                 parseFloat(markers[i].getAttribute('lng')));

         var marker = createMarker(point, name, address);
         map.addOverlay(marker);
         var sidebarEntry = createSidebarEntry(marker, name, address, distance);
         sidebar.appendChild(sidebarEntry);
         bounds.extend(point);
       }
       map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds-2));
     });
   }

    function createMarker(point, name, address) {
      var marker = new GMarker(point);
      var html = '<b>' + name + '</b> <br/>' + address;
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
      return marker;
    }

    function createSidebarEntry(marker, name, address, distance) {
      var div = document.createElement('div');
      var html = '<b>' + name + '</b> (' + distance.toFixed(1) + ')<br/>' + address;
      div.innerHTML = html;
      div.style.cursor = 'pointer';
      div.style.marginBottom = '5px'; 
      GEvent.addDomListener(div, 'click', function() {
        GEvent.trigger(marker, 'click');
      });
      GEvent.addDomListener(div, 'mouseover', function() {
        div.style.backgroundColor = '#eee';
      });
      GEvent.addDomListener(div, 'mouseout', function() {
        div.style.backgroundColor = '#fff';
      });
      return div;
    }
    //]]>
  </script>
  </head>

  <body onload="load()" onunload="GUnload()">
  Radius: <input name="radiusInput" id="radiusInput" size="10" ><br>
                <input type="radio" name="units" id="unitsMI" checked value="MI">Miles<br>
                <input type="radio" name="units" id="unitsKM" value="KM">Kilometers<br><br>
                <input type="submit" value="Draw" onclick="drawCircle()"><br><br>

    <br/>
<div style="width:600px; font-family:Arial, 
sans-serif; font-size:11px; border:1px solid black">
  <table> 
    <tbody> 
      <tr>
        <td width="200" valign="top"> <div id="sidebar" style="overflow: auto; height: 400px; font-size: 11px; color: #000"></div>

        </td>
        <td> <div id="map" style="overflow: hidden; width:400px; height:400px"></div> </td>

      </tr> 
    </tbody>
  </table>
</div>    
  </body>
</html>
War es hilfreich?

Lösung

Die Maps -API hat keine Funktion zum Löschen aller Marker mit Ausnahme eines.

Was Sie tun können, ist eine globale Reihe von Markierungsreferenzen für die Marker, die Sie entfernen möchten. Wenn Sie sie entfernen möchten, schalten Sie das Array durch und entfernen sie einzeln.

Das mag möglicherweise etwas ineffizient aussehen, aber map.clearoverlays () macht genau dasselbe, aber durch eine interne Reihe von Overlays, auf die Sie keinen Zugriff haben.

// global array of marker references
var gmarkers = [];

function createMarker(point, name, address) {
  var marker = new GMarker(point);
  gmarkers.push(marker); // store the reference
  ...
}

// remove those markers
for (var i=0; i<gmarkers.length; i++) {
  map.removeOverlay(gmarkers[i]);
}
// Wipe the array
gmarkers = [];
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top