Data

What kinds of Data?

* JSON, KML, Shapefile, CSV etc..

* Live streams, twitter, crowdsource data

 

Analysis Tools

Summarize Data

Find Locations

Manage Data

Use Proximity

Analyze Patterns

Data Enrichment

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

Map-centric app

NON map-centric app

No map - geographic data only

ArcGIS API for JavaScript

require(["esri/map", "dojo/domReady!"],
  function(Map) { 
    var map = new Map("map", 
       { 
         center: [-118, 34.5], 
         zoom: 8, 
         basemap: "topo" 
       }
    ); 
});
 
<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

Feature Layers

 

 

Example:

 

http://services.arcgis.com/uCXeTVveQzP4IIcx/ArcGIS/rest/services/Portland_TotalActivity/FeatureServer/0 

Feature Layers

API Module:

"esri/layers/FeatureLayer"

 

Handles all communication

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("map", {
                center: [-122.6717, 45.5275],
                zoom: 14,
                basemap: "dark-gray"
            });

            var url = "http://services.arcgis.com/uCXeTVveQzP4IIcx/ArcGIS/" +
                    "rest/services/Portland_TotalActivity/FeatureServer/0";

            var featureLayer = new FeatureLayer(url, {
                id: "world-regions"
            });

            map.addLayer(featureLayer);
        }
);

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

github.com/esri

Hundreds of samples, templates, open source projects

JavaScript Resources

https://developers.arcgis.com/javascript

 

https://github.com/Esri/quickstart-map-js

 

https://github.com/Esri/esri-leaflet

 

https://github.com/Esri/quickstart-map-phonegap

Copy of Copy of Johns Creek Competition

By dmart

Made with Slides.com

Copy of Copy of Johns Creek Competition

  • 1,673

More from dmart