1 / 17

Enhancing Web Mapping Capabilities for Your Development Options

Explore how to leverage ArcGIS for custom web maps, development options, and user-friendly interfaces. Learn the basics of using JavaScript and the API for custom map layers, pop-ups, analysis, and more. Discover how to utilize web maps in template-based apps and with the Web App Builder for easy and efficient map creation. Hosted on portal for easy access control, content management, and authentication.

deanmarcus
Télécharger la présentation

Enhancing Web Mapping Capabilities for Your Development Options

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. http://services.arcgisonline.com/.../World_Topo_Map/MapServerhttp://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS JS JS HTML HTML http://js.arcgis.com Portal http://portal.metro... /e911_locator/GeocodeServer YOU YOUR USERS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer http://www.cityOf.... /propertytaxes

  2. http://services.arcgisonline.com/.../World_Topo_Map/MapServerhttp://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS CSS CSS JS JS JS JS HTML HTML HTML HTML http://js.arcgis.com YOU Portal http://portal.metro... /e911_locator/GeocodeServer YOUR USERS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer 868 Granville St, Vancouver, BC V6Z 1K http://www.cityOf.... /propertytaxes

  3. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS CSS CSS JS JS JS JS HTML HTML HTML HTML http://js.arcgis.com TRADITIONALAPPROACH http://gis.metro... /e911_locator/GeocodeServer ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer http://www.cityOf.... /propertytaxes

  4. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS JS JS HTML HTML http://js.arcgis.com Use WEB MAP Web Map http://gis.metro... /e911_locator/GeocodeServer Portal ArcGIS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer http://www.cityOf.... /propertytaxes

  5. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS JS JS HTML HTML http://js.arcgis.com Use WEB MAP Web Map http://gis.metro... /e911_locator/GeocodeServer ArcGIS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer http://www.cityOf.... /propertytaxes

  6. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer CSS CSS JS JS HTML HTML http://js.arcgis.com Use WEB MAP Web Map http://gis.metro... /e911_locator/GeocodeServer ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer 868 Granville St, Vancouver, BC V6Z 1K http://www.cityOf.... /propertytaxes

  7. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer UseWEB MAP IN TEMPLATE-BASEDAPP Web Map http://gis.metro... /e911_locator/GeocodeServer Template Portal ArcGIS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer

  8. DEVELOPMENTOptions http://services.arcgisonline.com/.../World_Topo_Map/MapServer UseWEB MAP INAPP BUILT BY THEWEB APPBUILDER(WAB) Web Map http://gis.metro... /e911_locator/GeocodeServer WAB-built Portal ArcGIS ArcGIS http://geo.cityOf../Parcels/FeatureServer http://geo.cityOf../Parcels/MapServer

  9. Hosted on portal: • Easy to discover • Featured content and galleries • Access control • oAuth 2.0 authentication • Lots of content • Combines basemap and operational layers • Set/override layer symbology • Configure pop-ups • Add bookmarks • Add labeling • Control Legend content • Perform analysis WHAT IS A WEB MAP?

  10. Basic JavaScript and the API (with AMD syntax) map.js require();

  11. Basic JavaScript and the API (with AMD syntax) map.js require([]); array

  12. Basic JavaScript and the API (with AMD syntax) map.js require([], function(){...}); array the callback function

  13. Basic JavaScript and the API (with AMD syntax) map.js require( [], function(){ } );

  14. Basic JavaScript and the API (with AMD syntax) map.js require( ["esri/map"], function(Map){ varmyMap = new Map("divMap"); } ); A constructor statement API module alias <div id="divMap"> object index.html

  15. Basic JavaScript and the API (with AMD syntax) map.js require( ["esri/map", "esri/layers/ArcGISDynamicMapServiceLayer"], function(Map, ArcGISDynamicMapServiceLayer){ varmyMap = new Map("divMap"); varlyrUSA = new ArcGISDynamicMapServiceLayer("..."); myMap.addLayer(lyrUSA); } );

  16. Basic JavaScript and the API (with AMD syntax) map.js require( ["esri/map", "esri/layers/ArcGISDynamicMapServiceLayer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function(Map, ArcGISDynamicMapServiceLayer, BorderContainer, ContentPane){ varmyMap = new Map("divMap"); varlyrUSA = new ArcGISDynamicMapServiceLayer("..."); myMap.addLayer(lyrUSA); } );

  17. Basic JavaScript and the API (with AMD syntax) map.js require( ["esri/map", "esri/layers/ArcGISDynamicMapServiceLayer", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function(Map, ArcGISDynamicMapServiceLayer, BorderContainer, ContentPane){ varmyMap = new Map("divMap", { basemap : "streets", center : [-76.59, 39.29], zoom : 12 }); varlyrUSA = new ArcGISDynamicMapServiceLayer("..."); } ); JSON object

More Related