title: How to prevent LeafletJS from issuing multiple click events on overlapping markers?
body: <p>I have a LeafletJS map with <strong>a lot</strong> of markers on it, and many of them overlap at high zoom levels.  Currently, when I click on a few overlapping markers, multiple click events are being issued, each of which then issues a <code>popupopen</code> event which in turn does a <code>$.getJSON()</code> to populate the popup.  Obviously, this isn't ideal, so I'd like to find out how to get Leaflet to just execute one click at a time.</p>
  
  <p>Other answers I find on here talk about <code>e.preventDefault()</code> or <code>e.stopPropagation()</code>.  Neither of those appear to be available in Leaflet's <code>click</code> or <code>popupopen</code> events, so I'm thinking there must be a smarter way that I've not heard of.</p>
  
  <p>Here's my code, watered down for the purpose of this question:</p>
  
  <pre><code>var geojson_options = {
      onEachFeature: function(feature, layer){
          layer.bindPopup('&lt;img src="/spinner.gif" /&gt;');
          layer.on("popupopen", function(e){
              // e.preventDefault and e.stopPropogating don't exist
              $.getJSON("some-url.json", function(json){
                 e.popup.setContent("Some processing of the json");
              });
          });
      },
      pointToLayer: function (feature, latlng) {
        // Irrelevant stuff
      }
  };
  
  L.geoJson(geojson_data, geojson_options);
  </code></pre>
  
  <p>I've tried variations on using <code>layer.on("click", ...)</code> to set a variable called <code>popping_open</code> to <code>true</code> to keep state while the popup is opening, but that didn't work either.  Tell me there's a clean way to handle this?</p>