Book Image

Leaflet.js Essentials

By : Paul Crickard III, Paul Crickard
Book Image

Leaflet.js Essentials

By: Paul Crickard III, Paul Crickard

Overview of this book

Table of Contents (13 chapters)
Leaflet.js Essentials
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Query by proximity


In the previous example, you queried a feature layer based on an attribute. You can also query your feature layer based on its proximity to a point. In this example, you will query the layer based on the location of a mouse click. The following instructions will walk you through creating a proximity query:

  1. Reference the Esri-leaflet file as you have in previous examples. Add the feature layer to the map. You will pass the pointToLayer option, returning circleMarker for each feature. You need to create the circle marker so that you can change the color of the marker in a later step:

    var graffiti = L.esri.featureLayer('http://services.arcgis.com/ rOo16HdIMeOBI4Mb/ArcGIS/rest/services/Graffiti_Locations3/FeatureServer/0', {
       pointToLayer: function (geojson, latlng) {
          return L.circleMarker(latlng);
        },
      }).addTo(map);
  2. Create a pop-up template using the feature properties. Bind the pop up to the feature as follows:

    var popupTemplate = "<h3>Details:</h3>Address...