Leaflet dynamicMapLayer popup question

2826
3
Jump to solution
03-10-2015 08:43 AM
Highlighted
New Contributor II

Hello all,

  I am very new to Leaflet.

I am trying to set up a dynamicMapLayer to have a popup for every layer in the map service.

All of the examples that I have seen so far use canned examples with simple layer definitions.  I am using a map service with more than two dozen layers, each of which has a distinct set of fields.

What I would like to do is make popup definitions that are distinct to each layer.  Where I am getting stuck is that I do not know how to identify the layer names that are gathered into the featureCollection array.

This is the code that I am using below.  It returns a popup when it identifies a feature with the Facility Identifier and LegacyID fields.

Ideally, I would have a method return the appropriate popup fields based on the layer name (i.e. Sewer Manholes, Streets, Sewer Cleanout, etc...).

Can anyone point me in the right direction?   Thank you.

<!DOCTYPE html>

<html>

  <head>

    <meta charset=utf-8 />

  <title>Learning Leaflet</title>

  <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />

  <!-- Load Leaflet from CDN-->

  <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />

  <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>

  <script src="http://cdn-geoweb.s3.amazonaws.com/esri-leaflet/0.0.1-beta.5/esri-leaflet.js"></script>

    <style>

      html, body,  #map {

        width : 100%;

        height : 100%;

      }

    </style>

  </head>

  <body>

    <div id="map"></div>

    <script>

      document.getElement

      var map = L.map('map').setView([35.578, -82.50], 17);

     

      <!-- L.esri.basemapLayer("Gray").addTo(map); -->

     

      var networkInfrastructure = L.esri.dynamicMapLayer('http://gis.msdbc.org/arcgis/rest/services/InternalViewer/NetworkInfrastructureI/MapServer',{useCors: false}).addTo(map);

      var networkArray = networkInfrastructure.getLayers();

     

      networkInfrastructure.bindPopup(function(error, featureCollection) {

        if (error || featureCollection.features.length === 0) {

          alert("you missed.");   

          return false;

        } else {

         

         

          var obj = featureCollection.features[1].properties;

         

          // popup info

          var facilityID = obj["Facility Identifier"];

          var legacyID = obj["LEGACYID"];

         

          // return popup

          return 'Facility ID: ' + facilityID + "<br>" +

                 'Legacy ID: ' + legacyID;

        }

    });

     

     

    </script>

  </body>

</html>

Tags (2)
1 Solution

Accepted Solutions
Highlighted
Frequent Contributor

when we tagged Release Candidate 6, we enhanced identify so that individual features in the response would include a new property 'layerId' to explain which layer in the map service the individual feature came from.

after you bump the CDN version of esri-leaflet in your sample, you'll be able to access:

featureCollection.features.layerId

RC6 release notes

Release Release Candidate 6 · Esri/esri-leaflet · GitHub

the specific Pull Request that introduced the functionality

https://github.com/Esri/esri-leaflet/pull/462/

View solution in original post

3 Replies
Highlighted
Frequent Contributor

when we tagged Release Candidate 6, we enhanced identify so that individual features in the response would include a new property 'layerId' to explain which layer in the map service the individual feature came from.

after you bump the CDN version of esri-leaflet in your sample, you'll be able to access:

featureCollection.features.layerId

RC6 release notes

Release Release Candidate 6 · Esri/esri-leaflet · GitHub

the specific Pull Request that introduced the functionality

https://github.com/Esri/esri-leaflet/pull/462/

View solution in original post

Highlighted
New Contributor II

Thank you very much, John!  I appreciate you for both helping me and not mocking my inexperience. 

I changed the reference to the script on my local host and immediately saw the layer-id present in the featureCollection object. 

Reply
0 Kudos
Highlighted
Frequent Contributor

no sweat.

Reply
0 Kudos