![](https://s3.amazonaws.com/media-p.slid.es/uploads/311607/images/1780492/esrihq.jpg)
Text
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1795665/pasted-from-clipboard.png)
ArcGIS API for JavaScript
Building custom mapping apps
Adding mapping functionality to existing apps
Extending ArcGIS Online templates
Esri WebApp Builder custom widgets
Custom mapping apps
Map-centric app
Non map-centric app with map
Geographic analysis data - no map
Geographic data with no map
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1801396/pasted-from-clipboard.png)
Map-centric app
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1797021/pasted-from-clipboard.png)
NON map-centric app
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1797032/pasted-from-clipboard.png)
No map - geographic data only
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1797059/pasted-from-clipboard.png)
ArcGIS API for JavaScript
<link rel="stylesheet"
href="http://js.arcgis.com/3.14/esri/css/esri.css">
<script src="http://js.arcgis.com/3.14/"></script>
Hello World Map
Feature Layers
Geospatial database in the cloud
Accessible via HTTP requests
Get, add, update or delete geospatial data
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1801200/pasted-from-clipboard.png)
Feature Layers
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815781/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815869/aaatest_layer.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815870/aaatest_maponly.png)
Feature Layers
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815781/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815874/aaaa_mapandlayer.png)
Feature Layers
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815781/pasted-from-clipboard.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1815814/aaatest.png)
Points, lines or polygons
Feature Layers
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1801200/pasted-from-clipboard.png)
Feature Layers
API Module:
"esri/layers/FeatureLayer"
Handles all communication between app and the service
var featureLayer = new FeatureLayer("http://.../MapServer/2",{
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"],
infoTemplate: infoTemplate
});
map.addLayer(featureLayer);
Feature Layers
require([
"esri/map",
"esri/layers/FeatureLayer",
"dojo/domReady!"
], function(
Map,
FeatureLayer
) {
var map = new Map("mapDiv", {
basemap: "national-geographic",
center: [-84.1986, 34.0289],
zoom: 12
});
var url = "http://services.arcgis.com/uCXeTVveQzP4IIcx/ArcGIS/" +
"rest/services/POIJohnsCreek/FeatureServer/0";
var featureLayer = new FeatureLayer(url);
map.addLayer(featureLayer);
}
);
Feature Layers
ArcGIS Online Map
require([
"esri/map",
"esri/arcgis/utils",
"dojo/domReady!"
], function(Map, arcgisUtils){
arcgisUtils.createMap(<<Web Map Id>>, "mapDiv")
.then(function (response) {
map = response.map;
});
});
<link rel="stylesheet"
href="http://js.arcgis.com/3.14/esri/css/esri.css">
<script src="http://js.arcgis.com/3.14/"></script>
ArcGIS Online Map
Hundreds of samples, templates, open source projects
![](https://s3.amazonaws.com/media-p.slid.es/uploads/335046/images/1801332/pasted-from-clipboard.png)
JavaScript Resources
Johns Creek Competition
By Andy G
Johns Creek Competition
- 2,079