An excellent starter kit for those wishing to quickly deploy a lightning fast map displaying the contents of an ArcGIS for Server feature layer.
This kit uses bower, npm, and grunt to bundle a couple Leaflet plugins that enhance the application:
- Zoomhome - Adds a home button allowing a reset of the map to its initial extent
- Esri Leaflet Geocoder - Allows for searching and zooming to locations using Esri's public geocoder. A developer can configure to include other search sources or locators. The config.js file contains an example of adding a second source to the geocoder.
- Esri Leaflet Clustered Feature Layer - Displays feature layer as clusters. A necessary plugin if you have a large number of points or multiple records in the same location.
This starter kit is deployment ready. Follow the Getting Started instructions below and a simple map is ready in a matter of minutes .
npm install -g bower
- installs bowernpm install -g grunt-cli
- installs global gruntnpm install
- installs required node and bower packages. The application is ready to test in thesrc
foldernpm run build
- builds the application into thedist
foldergrunt clean:dist
- removes built files fromdist
directory
-
Make sure you have all requirements from above installed.
-
Fork or clone the repo.
-
Use
npm install
which downloads all dependencies (leaflet, plugins, jquery, bootstrap) and copies them to your src folder. -
Modify config.js to configure the application at minimum. You can speficy feature service for display, app defaults, search widget behaviour, etc. etc. config.js is well documented and contains examples to get you started. To change behavior or look/feel of the application, modify index.html app.js, and app.css.
-
Use
npm run build
which builds and minifies your JavaScript and CSS, and copies necessary files to your dist folder. -
Deploy your dist folder to any web server. It's that easy.