README

Esri Leaflet Renderers

Leaflet plugin for ArcGIS Feature Services. Esri Leaflet Renderers works in conjunction with the Esri Leaflet Plugin to draw feature services using renderers defined by the service.

The sole purpose of this plugin is to allow L.esri.FeatureLayer to automatically take on renderers defined in ArcGIS Feature Services. Esri Leaflet Renderers works in conjunction with Esri Leaflet, but it does not add any additional methods or properties to the class that it extends.

Example

Take a look at the live demo.

You can also find a side by side comparison of the ArcGIS API for JavaScript here.

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
    <title>Renderer from Service</title>
    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />

    <!-- Load Leaflet from CDN-->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet-src.js"></script>

    <!-- Load Esri Leaflet from CDN -->
    <script src="https://unpkg.com/esri-leaflet@2.1.4"></script>

    <!-- Load Esri Leaflet Renderers -->
    <!-- This will hook into Esri Leaflet to get renderer info when adding a feature layer -->
    <script src="https://unpkg.com/esri-leaflet-renderers@2.0.6"></script>

    <style>
      body {margin:0;padding:0;}
      #map {position: absolute;top:0;bottom:0;right:0;left:0;}
    </style>
  </head>
  <body>

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

    <script>
      var map = L.map('map').setView([45.526, -122.667], 13);
      L.esri.basemapLayer('Streets').addTo(map);

      // this plugin will get the predefined renderer from the layer's drawing info at:
      // https://services.arcgis.com/P3ePLMYs2RVChkJx/arcgis/rest/services/World_Regions/FeatureServer/0
      // use that renderer to style the polygons drawn on the map
      L.esri.featureLayer({
        url: 'https://services.arcgis.com/P3ePLMYs2RVChkJx/arcgis/rest/services/World_Regions/FeatureServer/0',
        simplifyFactor: 1
      }).addTo(map);
    </script>

  </body>
</html>

Development Instructions

Fork and clone Esri Leaflet Renderers
cd into the esri-leaflet-renderers folder
Install the dependencies with npm install
Run npm start from the command line. This will compile minified source in a brand new dist directory, launch a tiny webserver and begin watching the raw source for changes.
Run npm test to make sure you haven't introduced a new 'feature' accidently.
Make your changes and create a pull request

Limitations

As of 2.0.1, It is possible to override aspects of polyline and polygon symbology defined by the service in the FeatureLayer constructor. For points, it is not.
Simple Marker symbols do not support rotation (ie: the 'angle' property is ignored).
Polygons only support solid fill. This does not include advanced fill types like PictureFill, Backward Diagonal, DiagonalCross, etc.
Text symbols are not supported.

Dependencies

Esri Leaflet Renderers 1.x (available on CDN) can be used in apps alongside:
- Leaflet version 0.7.x.
- Esri Leaflet version 1.0.x.
Esri Leaflet Renderers 2.x (available on CDN) can be used in apps alongside:
- Leaflet version 1.0.0-rc.3.
- Esri Leaflet version 2.0.x.

Versioning

For transparency into the release cycle and in striving to maintain backward compatibility, Esri Leaflet is maintained under the Semantic Versioning guidelines and will adhere to these rules whenever possible.

Releases will be numbered with the following format:

<major>.<minor>.<patch>

And constructed with the following guidelines:

Breaking backward compatibility bumps the major while resetting minor and patch
New additions without breaking backward compatibility bumps the minor while resetting the patch
Bug fixes and misc changes bumps only the patch

For more information on SemVer, please visit http://semver.org/.

Contributing

Esri welcomes contributions from anyone and everyone. Please see our guidelines for contributing.

Licensing

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

A copy of the license is available in the repository's LICENSE file.

Usage no npm install needed!