geodev-hackerlabs

Add feature layers with Esri Leaflet

In this lab, you will add featurelayers to an Esri Leaflet application.

1. Open the starter map HTML and copy the contents to a new jsbin.com.

2. In JSBin > HTML, add the following plugin to draw the layer styles:

    <!-- Load Esri Leaflet Renderers -->
    <script src="https://unpkg.com/esri-leaflet-renderers@2.0.2"></script>
   
   

3. Add the following layers to the map:

    <script type='text/javascript'>
        var map = L.map('map').setView([45.533, -122.657], 12);
        L.esri.basemapLayer('DarkGray').addTo(map);
   
         // ADD the rail lines here
        L.esri.featureLayer({
            url: 'https://services.arcgis.com/uCXeTVveQzP4IIcx/arcgis/rest/services/PDX_Rail_Lines_Styled/FeatureServer/0'
        }).addTo(map);
   
    </script>
   

4. Run and test the app.

Your app should look something like this:

• Code
• Live App

Bonus

• Add a Rail Stops feature layer to the map, and then add a Neighborhoods feature layer.
• Use Leaflet’s new Map Panes to get control over display order