ArcGIS JavaScript API (build a web layer-based map application with html5 and javascript)
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

ArcGIS JavaScript API (build a web layer-based map application with html5 and javascript)

  • 7,189 views
Uploaded on

The "ArcGIS JavaScript API", sits directly on top of Dojo framework, providing developers with access to Dojo user interface widgets and all the other benefits of Dojo core. Whit this ArcGIS you......

The "ArcGIS JavaScript API", sits directly on top of Dojo framework, providing developers with access to Dojo user interface widgets and all the other benefits of Dojo core. Whit this ArcGIS you can build a html5/javascript mapping applications and the api allows you to easily embed maps in your web pages. An ArcGIS application utilizes a layer-based (TiledLayer, DynamicLayer, FeatureLayer, etc...) geographic information model for characterizing and describing our world. An ArcGIS application asks what it need, through a http/rest service (the service will return images or json data - for example) hosted on the ArcGIS server. In this simple html5/javascript demo project (http://sdrv.ms/UGlW0p) you can find five examples that show the basic functionality of the mapping framework "ArcGIS API for JavaScript" (will be shown the basic functionality of the ArcGIS classes layer). You can download the demo code at this link: http://sdrv.ms/UGlW0p - There is also a video on YouTube: http://youtu.be/2IV29O0dW2M

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
7,189
On Slideshare
6,799
From Embeds
390
Number of Embeds
5

Actions

Shares
Downloads
79
Comments
0
Likes
0

Embeds 390

http://www.scoop.it 378
http://pinterest.com 5
http://www.verious.com 4
http://www.linkedin.com 2
http://webcache.googleusercontent.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. ArcGis API for JavaScript Welcome to "ArcGIS API for JavaScript" demo application
  • 2. ArcGIS API for JavaScriptThe ArcGIS api for JavaScript is a browser based api for developing highperformance mapping applications and the api allows you to easily embedmaps in your web pages. An ArcGIS application utilizes a layer-basedgeographic information model for characterizing and describing our world.
  • 3. ArcGIS API for JavaScript
  • 4. ArcGIS API for JavaScriptThe geodatabase is the common data storage and managementframework for ArcGIS. It combines "geo" (spatial-data) with "database"(data-repository) to create a central data repository for spatial datastorage and management.
  • 5. ArcGIS API for JavaScriptThe ArcGIS Server is the primary platform to create, manage, and distributemaps and capabilities. An ArcGIS application asks what it need, through arest service. http://sampleserver1.arcgisonline.com/ http://.../ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServerIf you put the url into the browser, you can see the service documentation.When the javascript api call this url, it add additional parameters . /ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer? f=json&dpi=96&transparent=true&format=png8&callback=dojo.io.script.jsonp_dojoI oScript6._jsonpCallback HTTP/1.1The service can return an image or json data (it depends from the servicetype and the class type used).
  • 6. ArcGIS API for JavaScriptThe ArcGIS JavaScript API, sits directly on top of Dojo framework,providing developers with access to Dojo user interface widgets and all theother benefits of Dojo core.
  • 7. ArcGIS API for JavaScriptBelow you can see some layer class.
  • 8. ArcGIS API for JavaScriptArcGISTiledMapServiceLayer: ArcGIS Server cached map service, hostinga set of map image tiles (are not interactive).ArcGISDynamicMapServiceLayer: ArcGIS Server non-cached map service,that generates map images on the fly (are not interactive).FeatureLayer: Feature layers represent layers that contain features(geometry and attributes). Feature layers are a special type of Graphicslayer that allow you to display features. Differ from tiled and dynamic layersbecause feature layers bring geometry information across to the clientcomputer to be drawn by the web browser. You can perform operation as:query, create, update, delete (are interactive). Geodatabase (geometry, attributes and more)
  • 9. ArcGIS API for JavaScript Demo
  • 10. ArcGIS API for JavaScript ArcGISTiledMapServiceLayervar tiledMapServiceLayer;tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer(url);map.addLayer(tiledMapServiceLayer); The code above add a tiled cached map (return a static map).
  • 11. ArcGIS API for JavaScript ArcGISDynamicMapServiceLayer / 1 var lvisible = [0]; var param = { "transparent": true }; var layer = new esri.layers.ArcGISDynamicMapServiceLayer(url, param); layer.setVisibleLayers(lvisible); map.addLayer(layer);The code above perform a query on a DynamicLayer (return a dynamic map).
  • 12. ArcGIS API for JavaScript ArcGISDynamicMapServiceLayer / 2var layerDefs = [];layerDefs3[5] = "STATE_NAME=Kansas";layerDefs3[4] = "STATE_NAME=Kansas and POP2007>10000";layerDefs3[3] = "STATE_NAME=Kansas and POP2007>10000";var imageParam = new esri.layers.ImageParameters();imageParam.layerDefinitions = layerDefs;imageParam.layerIds = [5, 4, 3];imageParam.transparent = true;var layer = new sri.layers.ArcGISDynamicMapServiceLayer(url, {"imageParameters": imageParam });map.addLayer(layer);The code above perform a query on a DynamicLayer (return a dynamic map).
  • 13. ArcGIS API for JavaScript FeatureLayervar layer = new esri.layers.FeatureLayer( url , { mode: esri.layers.FeatureLayer.MODE_SNAPSHOT, outFields: ["NAME", "POP2000", "POP2007", "POP00_SQMI", "POP07_SQMI"]});layer.setDefinitionExpression("STATE_NAME = Kansas");layer.setRenderer(new esri.renderer.SimpleRenderer(symbol));map.addLayer(layer); The code above perform a query on a FutureLayer.You can perform operation as: query, create, update, delete (are interactive).
  • 14. ArcGIS API for JavaScript QueryTaskvar queryTask = new esri.tasks.QueryTask(url);var query = new esri.tasks.Query();query.outSpatialReference = { wkid: 102100 };query.outFields = ["STATE_NAME", "CITY_NAME“, "MALES", "FEMALES"];query.where = "STATE_NAME =‘California’ ";queryTask.execute(query, callback); A QueryTask perform a query and return json data.
  • 15. ArcGIS API for JavaScript Demo
  • 16. ArcGIS API for JavaScriptYou can download the demo code at this link: http://sdrv.ms/UGlW0p There is also a video on YouTube: http://youtu.be/2IV29O0dW2M