Esri-Leaflet<\/h2>\n
Esri-Leaflet<\/a>\u00a0is a Javascript library to help developers build lightweight applications using the Leaflet Javascript mapping library.<\/strong>\u00a0It works well with\u00a0Terraformer<\/a>\u00a0for converting data between different geo formats, and\u00a0geoservices-js<\/a>\u00a0for making advanced requests to ArcGIS REST services such as place finding and reverse geocoding. If you\u2019re familiar with Leaflet, you\u2019ll feel right at home using this library. All of the Leaflet conventions are followed, so you can use ArcGIS services in a familiar style. One of the major benefits of using Esri-Leaflet over accessing the ArcGIS map tiles directly is this library handles displaying the correct attributions depending on the visible map area. Esri-Leaflet also has support for displaying\u00a0retina basemaps<\/strong>!<\/p>\n Below is an example of displaying a tiled ArcGIS map service over the gray basemap in an Esri Leaflet map.\u00a0 Of course we\u2019re not limited to displaying just points or polygons, lines work too! Here is a map showing bike routes in Portland.\u00a0 Check out\u00a0more demos<\/a>\u00a0on the Esri-Leaflet Github page!<\/p>\n Geoservices.js<\/a>\u00a0is a Javascript client that allows you to retrieve data and make queries against ArcGIS Online and to other services that adhere to the\u00a0Geoservices specification<\/a>.<\/strong>\u00a0It works both in the browser:<\/p>\n and from Node.js!<\/p>\n Currently it can be used to consuming free services, and you can also use it to authenticate and consume paid services. For now, it supports\u00a0geocoding<\/a>\u00a0and\u00a0feature services<\/a>, and will soon support the\u00a0directions and routing services<\/a>\u00a0and eventually the geometry service. Here is sample code for using the simple geocoder service:<\/p>\n Terraformer<\/a>\u00a0is a geometry toolkit for working with different geometry formats and building geo databases.<\/strong>Terraformer is a lightweight Javascript library that can be used both from the browser and from Node.js. You can use Terraformer to<\/p>\n For example, Terraformer can load in a file of all the US counties, build an R-Tree index, and can then quickly query which county a given latitude\/longitude is within.\u00a0Demographic Data Service<\/h3>\n
![\"\"](\"http:\/\/aaronparecki.com\/articles\/2013\/07\/12\/1\/files\/esri-leaflet-demographic-maps-portland.jpg\")
<\/a>
\nIt\u2019s as simple as this code snippet!<\/p>\nvar baseUrl = \"http:\/\/services.arcgisonline.com\/ArcGIS\/rest\/services\/Demographics\/\r\nUSA_Tapestry\/MapServer\";\r\n\r\ntiledLayer = L.esri.tiledMapLayer(url, {\r\n opacity: 0.25,\r\n zIndex:2,\r\n detectRetina: true\r\n }).addTo(map);<\/pre>\nBike Routes<\/h3>\n
![\"Bike](\"http:\/\/aaronparecki.com\/articles\/2013\/07\/12\/1\/files\/esri-leaflet-symbolize-line-features-bike-routes-portland.jpg\")
<\/a><\/p>\nL.esri.featureLayer(\"http:\/\/services.arcgis.com\/uCXeTVveQzP4IIcx\/arcgis\/rest\/services\/\r\nbike_rte\/FeatureServer\/0\", {\r\n style: function (feature) {\r\n return getStyle(feature);\r\n },\r\n onEachFeature: function(geojson, layer){\r\n layer.bindPopup(\"<h3>\"+geojson.properties.BIKEMODE+\"<\/h3><p>\r\n\" +(geojson.properties.PREFIX ? geojson.properties.PREFIX : \"\")+\r\n\" \" +(geojson.properties.STREETNAME ? geojson.properties.STREETNAME : \"\")+\r\n\" \" +(geojson.properties.FTTYPE ? geojson.properties.FTTYPE : \"\")+\" \"); } }).addTo(map);<\/pre>\nMore Demos<\/h3>\n
Geoservices.js<\/h2>\n
<script src=\"browser\/geoservices.js\"><\/script>\r\n<script> var client = new Geoservices(); <\/script><\/pre>\n
var Geoservices = require('geoservices'); \r\nvar client = new Geoservices();<\/pre>\nclient.geocode({ text: \"920 SW 3rd Ave, Portland, OR 97204\" }, function (err, result) {\r\n if (err) {\r\n console.error(\"ERROR: \" + err);\r\n } else {\r\n console.log(\"Found it at \" + result.locations[0].feature.geometry.y + \", \r\n\" result.locations[0].feature.geometry.x);\r\n }\r\n});<\/pre>\nTerraformer<\/h2>\n
\n
![\"US](\"http:\/\/aaronparecki.com\/articles\/2013\/07\/12\/1\/files\/terraformer-us-counties.jpg\")
<\/a><\/p>\nPushlet<\/h2>\n
"}],"related_articles":"","card_image":false,"wide_image":false},"yoast_head":"\n