After defining your map, you first need to declare the variable you'll be using:
var clickCircle;
While popups automatically disappear on the next click, circles do not. The following code removes the former circle from the leaflet map before drawing the new circle:
function onMapClick(e) { if (clickCircle != undefined) { map.removeLayer(clickCircle); };
Next, we want our function to draw the new circle (NB: "1609 * 3" is the radius of the circle. This makes the radius equal 3 miles):
clickCircle = L.circle(e.latlng, 1609 * 3, { color: '#f07300', fillOpacity: 0, opacity: 0.5 }).addTo(map); }
And finally, we need to add an event listener so that the function will be run when a user clicks on the map:
map.on('click', onMapClick);
The full code is available in a gist.
No comments:
Post a Comment