Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove Polygon from the map

Requirements: Using the Leaflet js maps api, when the customer clicks on a marker, a Rectangle should be drawn just below the Marker, centering according to the marker. Then clicking on another marker should remove previous rectangles and draw another rectangle below newly clicked marker.

Problem: I am using the code below to draw a polygon and I can see a rectangle. And it draws the rectangle on a marker. Then by clicking on another marker a new rectangle is being drawn. But the old rectangle also still exists.

Question: How should I implement the behavior, so that when clicking on new marker, the old rectangle will be deleted from the map?

 //polygon

var latBlockSize = 0.002;
var lngBlockSize = 0.002;
var route = [
      new L.LatLng(parseFloat(customer.MailingAddress.Lat) + latBlockSize, parseFloat(customer.MailingAddress.Lng) - lngBlockSize),
      new L.LatLng(parseFloat(customer.MailingAddress.Lat) + latBlockSize, parseFloat(customer.MailingAddress.Lng) + lngBlockSize),
      new L.LatLng(parseFloat(customer.MailingAddress.Lat) - latBlockSize, parseFloat(customer.MailingAddress.Lng) + lngBlockSize),
      new L.LatLng(parseFloat(customer.MailingAddress.Lat) - latBlockSize, parseFloat(customer.MailingAddress.Lng) - lngBlockSize)
   ];

window.polygon = new L.Polygon(route);

window.map.addLayer(window.polygon);
like image 367
Asif Ashraf Avatar asked Jun 30 '12 08:06

Asif Ashraf


People also ask

How do I remove a symbol from Google Maps?

Find the “Layers” menu in the bottom left corner of the screen. Hover your cursor over the box and wait until more options appear. Click “More” to open the Map Details menu. Under “Map Type,” you'll see a checked box next to “Labels.” Uncheck it to remove all labels.

How do you delete a polygon in Google Earth?

Select the items in the Places panel and use the delete key on the keyboard, or right click and delete. If you have the latest version of Google Earth Pro you can multi select items in the Places panel.


2 Answers

I figured it out by myself.

This was the solution:

window.map.removeLayer(window.polygon);
like image 92
Asif Ashraf Avatar answered Oct 04 '22 15:10

Asif Ashraf


That is working as well, tested with Leaflet 1.2.0.

window.polygon.remove()

like image 29
arsenik Avatar answered Oct 04 '22 13:10

arsenik