![Page 1: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/1.jpg)
Building Mashups Using the ArcGIS APIs for Building Mashups Using the ArcGIS APIs for FLEX and JavaScriptFLEX and JavaScript
Shannon BrownShannon BrownLee BockLee Bock
![Page 2: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/2.jpg)
AgendaAgenda
•• IntroductionIntroduction–– MashupsMashups–– State of the Web ClientState of the Web Client
•• ArcGIS Javascript APIArcGIS Javascript API
•• ArcGIS API for FLEXArcGIS API for FLEX
![Page 3: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/3.jpg)
What is a What is a ““mashupmashup””??
![Page 4: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/4.jpg)
What is a What is a ““mashupmashup””??
In web development, a mashup is a web In web development, a mashup is a web application that combines data from more than application that combines data from more than one source into a single integrated tool.one source into a single integrated tool.
-- WikipediaWikipedia
![Page 5: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/5.jpg)
ArcGIS Server 9.3 mashupsWhat is a mashup?
Desktop
Supported Web ClientsSupported Web Clients
ArcGIS ClientsArcGIS Clients
Consumer MappingConsumer Mapping
Mashup
ArcGIS JavaScript APIArcGIS JavaScript APIVirtual EarthVirtual Earth\\Google MapsGoogle Maps
Google Earth
Explorer
OpenLayersOpenLayers
Web Map
Yahoo PipesYahoo Pipes
Adobe Flex/Java Fx/SilverlightAdobe Flex/Java Fx/Silverlight
Other Web ClientsOther Web Clients
RESTREST
RESTREST
RESTREST
REST/
SOAP
REST/
SOAP
KML/REST
KML/REST
SOAPSOAP
![Page 6: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/6.jpg)
DemoDemoLandscopeLandscope
![Page 7: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/7.jpg)
Rich Internet Applications (RIARich Internet Applications (RIA’’s)s)MiniUSAMiniUSA
•• ExpressiveExpressive•• InteractiveInteractive•• DynamicDynamic•• Allow data Allow data
fetching without fetching without page refresh.page refresh.
![Page 8: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/8.jpg)
State of the Web ClientState of the Web ClientBack to the Back to the ““thickthick”” clientclient
•• 11stst Gen: Gen: HTMLHTML
•• 22ndnd Gen: Gen: ActiveX / JavaActiveX / Java
•• 33rdrd Gen: Gen: Application Application ServerServer
•• 44thth Gen: Gen: Rich Internet Rich Internet ApplicationsApplications
![Page 9: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/9.jpg)
Technologies for RIATechnologies for RIAEnabling mashups Enabling mashups –– (Web 2.0)(Web 2.0)
•• ExpressiveExpressive•• InteractiveInteractive•• DynamicDynamic
![Page 10: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/10.jpg)
Our Goal TodayOur Goal Today
•• To give you a quick overview of two RIA technologies To give you a quick overview of two RIA technologies and their respective APISand their respective APIS
–– JavaScript (AJAX)JavaScript (AJAX)–– Flex (Flash)Flex (Flash)
![Page 11: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/11.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API––What is Javascript?What is Javascript?––What is the ArcGIS Javascript APIWhat is the ArcGIS Javascript API–– Getting StartedGetting Started–– Site Starters Site Starters –– JS ViewerJS Viewer–– ArcGIS JavaScript ExtensionsArcGIS JavaScript Extensions
•• Google MapsGoogle Maps•• Microsoft Virtual EarthMicrosoft Virtual Earth
•• ArcGIS API for FLEXArcGIS API for FLEX
![Page 12: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/12.jpg)
What is JavascriptWhat is Javascript
•• Increase the interactivity of web pages Increase the interactivity of web pages
•• Pure client development; runs in the browserPure client development; runs in the browser
•• No web application server (IIS, Apache/Tomcat)No web application server (IIS, Apache/Tomcat)
•• No download or install; not a plugNo download or install; not a plug--inin
•• All web browsers know how to interpret it.All web browsers know how to interpret it.
•• Develop in text editorDevelop in text editor
![Page 13: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/13.jpg)
Why Javascript?Why Javascript?
•• Stability Stability -- no new changes in ECMAScript since 1999no new changes in ECMAScript since 1999
•• One of the most used languages in the worldOne of the most used languages in the world
•• Accessible to beginnersAccessible to beginners
•• LibrariesLibraries
![Page 14: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/14.jpg)
What is the ArcGIS Javascript API?What is the ArcGIS Javascript API?
•• Free Browser based APIFree Browser based API
•• Collection of Javascript classes Collection of Javascript classes
•• For developing high performance, easy to use mapping For developing high performance, easy to use mapping applications. applications.
•• Hosted by ESRI on ArcGIS OnlineHosted by ESRI on ArcGIS Online–– High performance and availability (Akamai)High performance and availability (Akamai)
•• Embed maps and tasks from any ArcGIS Server into your websiteEmbed maps and tasks from any ArcGIS Server into your website
•• Uses the REST APIUses the REST API
•• Built on Dojo Toolkit Built on Dojo Toolkit
![Page 15: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/15.jpg)
Dojo ToolkitDojo Toolkithttp://dojotoolkit.org/http://dojotoolkit.org/
•• Javascript libraryJavascript library•• Abstract browser complexityAbstract browser complexity•• Powerful eventing model and graphics supportPowerful eventing model and graphics support•• Dojo DijitsDojo Dijits
–– GridsGrids–– ChartsCharts–– ToolbarsToolbars–– TreesTrees–– Many moreMany more
•• Active CommunityActive Community
![Page 16: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/16.jpg)
DemoDemoKansas Oil and GasKansas Oil and Gas, , Thematic RepresentationThematic Representation
![Page 17: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/17.jpg)
ArcGIS Server FunctionsArcGIS Server Functions
•• MapsMaps
–– Tiled MapsTiled Maps•• CachedCached•• Accesses tiles from a cache instead of dynamically rendering imaAccesses tiles from a cache instead of dynamically rendering imagesges
–– Dynamic MapsDynamic Maps•• Generates images on the flyGenerates images on the fly
–– Map NavigationMap Navigation•• Drag the mouse to pan Drag the mouse to pan •• Mouse Scroll Forward to zoom in Mouse Scroll Forward to zoom in •• Mouse Scroll Backward to zoom out Mouse Scroll Backward to zoom out •• SHIFT + Drag the mouse to zoom in SHIFT + Drag the mouse to zoom in •• SHIFT + CTRL + Drag the mouse to zoom out SHIFT + CTRL + Drag the mouse to zoom out •• SHIFT + Click to recenter SHIFT + Click to recenter •• SHIFT + Double Click to Center and Zoom in SHIFT + Double Click to Center and Zoom in •• Use arrow keys to pan Use arrow keys to pan •• Use + key to zoom in a level Use + key to zoom in a level •• Use Use -- key to zoom out a level key to zoom out a level
![Page 18: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/18.jpg)
DemoDemoBase MapBase Map, , ExtentExtent, , Operational LayerOperational Layer
GraphicsSymbolsGeometryAttributesInfoTemplate
![Page 19: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/19.jpg)
![Page 20: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/20.jpg)
ArcGIS Server FunctionsArcGIS Server Functions
•• GraphicsGraphics
–– Graphics (geometry + attributes + symbol + InfoTemplate)Graphics (geometry + attributes + symbol + InfoTemplate)
–– Each map has a GraphicLayerEach map has a GraphicLayer
–– Allows for the drawing of graphics on top of the mapAllows for the drawing of graphics on top of the map
–– Can be drawn by the user as markup or input to a taskCan be drawn by the user as markup or input to a task
–– Can be drawn by the application in response to a taskCan be drawn by the application in response to a task
–– Exist as vectors in the browserExist as vectors in the browser
–– Mouse Events on GraphicLayerMouse Events on GraphicLayer•• onClick, OnMouseIn, OnMouseOut, OnMouseOveronClick, OnMouseIn, OnMouseOut, OnMouseOver
![Page 21: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/21.jpg)
Demo Demo –– GraphicsGraphicsGraphic with Info TemplateGraphic with Info Template, , Click to Add PointClick to Add Point
![Page 22: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/22.jpg)
ArcGIS Server FunctionsArcGIS Server Functions
•• TasksTasks
–– QueryTaskQueryTask
–– LocatorLocator
–– FindTaskFindTask
–– IdentifyTaskIdentifyTask
–– GeometryGeometry
–– Geoprocessor (synchronous or asynchronous)Geoprocessor (synchronous or asynchronous)•• DataData•• Map imageMap image
![Page 23: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/23.jpg)
Demo Demo –– GP TaskGP TaskPopulation Zonal StatisticsPopulation Zonal Statistics
![Page 24: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/24.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API–– What is Javascript?What is Javascript?–– What is the ArcGIS Javascript APIWhat is the ArcGIS Javascript API
––Getting StartedGetting Started–– Site Starters Site Starters –– JS ViewerJS Viewer–– ArcGIS JavaScript ExtensionsArcGIS JavaScript Extensions
•• Google MapsGoogle Maps•• Microsoft Virtual EarthMicrosoft Virtual Earth
•• ArcGIS API for FLEXArcGIS API for FLEX
![Page 25: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/25.jpg)
Creating JavaScript mapping Web pagesCreating JavaScript mapping Web pages
ArcGIS ServerArcGIS Server
1. Author Maps / GP Models
2. Publish resources to ArcGIS Server
3. Discover services using
Services Directory
4. Copy/Paste HTML/JS from
Resource Center
5. Preview Web application
HTML / JS
![Page 26: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/26.jpg)
ArcGIS Server Resource CenterArcGIS Server Resource Center
•• http://resources.esri.com/arcgisserverhttp://resources.esri.com/arcgisserver
![Page 27: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/27.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIsArcGIS Javascript APIs–– What is Javascript?What is Javascript?–– What is the ArcGIS Javascript APIWhat is the ArcGIS Javascript API–– Getting StartedGetting Started––Sample ViewerSample Viewer–– ArcGIS JavaScript ExtensionsArcGIS JavaScript Extensions
•• Google MapsGoogle Maps•• Microsoft Virtual EarthMicrosoft Virtual Earth
•• ArcGIS API for FLEXArcGIS API for FLEX
![Page 28: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/28.jpg)
Sample Javascript ViewerSample Javascript ViewerJavascript ViewerJavascript Viewer
![Page 29: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/29.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIsArcGIS Javascript APIs–– What is Javascript?What is Javascript?–– What is the ArcGIS Javascript APIWhat is the ArcGIS Javascript API–– Getting StartedGetting Started–– Site Starters Site Starters –– JS ViewerJS Viewer
––ArcGIS JavaScript ExtensionsArcGIS JavaScript Extensions•• Google MapsGoogle Maps•• Microsoft Virtual EarthMicrosoft Virtual Earth
•• ArcGIS API for FLEXArcGIS API for FLEX
![Page 30: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/30.jpg)
•• Combine GIS content hosted in ArcGIS Server with content on top Combine GIS content hosted in ArcGIS Server with content on top of Google Maps or Virtual Earth base mapsof Google Maps or Virtual Earth base maps
•• Works with backend ArcGIS Server servicesWorks with backend ArcGIS Server services
•• Applications can be built in *traditional* Mashup form or as Applications can be built in *traditional* Mashup form or as Google Mapplets (maps.google.com)Google Mapplets (maps.google.com)
•• VE Shapes and Tiles can be viewed in 2D and 3DVE Shapes and Tiles can be viewed in 2D and 3D
•• Tiled Maps are in the WGS 1984 Web Mercator projectionTiled Maps are in the WGS 1984 Web Mercator projection–– WKID: 102113 WKID: 102113
ArcGIS Server Javascript Extensions ArcGIS Server Javascript Extensions Google Maps API Google Maps API , , Virtual EarthVirtual Earth
![Page 31: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/31.jpg)
Other ResourcesOther Resources•• Online SDKsOnline SDKs
–– http://resources.esri.com/arcgisserver/apis/javascript/http://resources.esri.com/arcgisserver/apis/javascript/......–– Sample drivenSample driven–– Code galleryCode gallery–– Samples powered by an ArcGIS Server sample serverSamples powered by an ArcGIS Server sample server
•• http://sampleserver1.arcgisonline.com/arcgis/rest/serviceshttp://sampleserver1.arcgisonline.com/arcgis/rest/services•• http://sampleserver2.arcgisonline.com/arcgis/rest/serviceshttp://sampleserver2.arcgisonline.com/arcgis/rest/services
•• JavaScript hosted by ESRIJavaScript hosted by ESRI–– http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1–– Flexible release cycleFlexible release cycle–– Hosted by ArcGIS Online Hosted by ArcGIS Online
•• 24/724/7
![Page 32: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/32.jpg)
SummarySummary
![Page 33: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/33.jpg)
Questions?Questions?
![Page 34: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/34.jpg)
AgendaAgenda
![Page 35: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/35.jpg)
What is Flash?What is Flash?
•• Technology for delivering RIA to Technology for delivering RIA to browserbrowser
•• Runs in the Flash PlayerRuns in the Flash Player
•• Compiled executableCompiled executable–– Delivered as a SWF fileDelivered as a SWF file
•• Even if youEven if you’’ve never heard of it, you have seen itve never heard of it, you have seen it……
![Page 36: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/36.jpg)
Advantages of FlashAdvantages of Flash
•• UbiquityUbiquity
•• CrossCross--browser compatibilitybrowser compatibility
•• CompiledCompiled–– Discover errors at compileDiscover errors at compile--time vs. runtime vs. run--timetime
•• Layout toolsLayout tools
•• BuiltBuilt--in transitions and effectsin transitions and effects
![Page 37: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/37.jpg)
Ways to Create Flash AppsWays to Create Flash Apps
•• FlashFlash–– Uses movie metaphorUses movie metaphor
–– Popular among designers/artistsPopular among designers/artists
–– Stores documents in binary formStores documents in binary form
•• FlexFlex–– Uses XMLUses XML
–– Created for IT programmersCreated for IT programmers
–– Stores docs in text formStores docs in text form
![Page 38: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/38.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API
•• ArcGIS API for FLEXArcGIS API for FLEX•• What is Flash?What is Flash?•• Using FlexUsing Flex•• ArcGIS API for FlexArcGIS API for Flex•• Getting StartedGetting Started•• Flex Sample ViewerFlex Sample Viewer
![Page 39: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/39.jpg)
•• MXMLMXML–– Used to define the GUIUsed to define the GUI
–– Create objects declarativelyCreate objects declaratively
–– XML based tagsXML based tags
The BasicsThe Basics
•• ActionScriptActionScript
–– EcmaEcma--based scripting languagebased scripting language
–– ObjectObject--orientedoriented
![Page 40: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/40.jpg)
MXML & ActionScriptMXML & ActionScript
![Page 41: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/41.jpg)
Flex BuilderFlex Builder
Demo
![Page 42: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/42.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API
•• ArcGIS API for FLEXArcGIS API for FLEX•• What is Flash?What is Flash?•• Using FlexUsing Flex•• ArcGIS API for FlexArcGIS API for Flex•• Getting StartedGetting Started•• Flex Sample ViewerFlex Sample Viewer
![Page 43: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/43.jpg)
ArcGIS API for FlexArcGIS API for Flex
•• Collection of ActionScript classesCollection of ActionScript classes
•• ProvidesProvides–– Map canvas Map canvas –– Various GIS objects Various GIS objects
•• e.g. Graphics, Geometry, Layerse.g. Graphics, Geometry, Layers–– UtilitiesUtilities
•• e.g. Toolbarse.g. Toolbars
•• Handles communication w/ ServerHandles communication w/ Server
•• Uses the REST APIUses the REST API
Flash Application
Flex API
ArcGIS ServerArcGIS Server ArcGIS OnlineArcGIS Online
ArcIMSArcIMS
REST
![Page 44: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/44.jpg)
ArcGIS Server FunctionsArcGIS Server Functions
•• Maps (layers)Maps (layers)–– ArcGISDynamicMapServiceLayerArcGISDynamicMapServiceLayer–– ArcGISTiledMapServiceLayerArcGISTiledMapServiceLayer–– ArcGISImageServiceLayerArcGISImageServiceLayer–– ArcIMSMapServiceLayerArcIMSMapServiceLayer–– GPResultImageLayerGPResultImageLayer
•• TasksTasks–– FindFind–– GeometryServiceGeometryService–– GeoprocessorGeoprocessor–– IdentifyIdentify–– LocatorLocator–– QueryQuery
Flash Application
Flex API
ArcGIS ServerArcGIS Server ArcGIS OnlineArcGIS Online
ArcIMSArcIMS
REST
![Page 45: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/45.jpg)
Some DemosSome Demos
![Page 46: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/46.jpg)
Using the APIUsing the API
•• Delivered as a SWCDelivered as a SWC•• Included in the Flex Build PathIncluded in the Flex Build Path
Demo
![Page 47: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/47.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API
•• ArcGIS API for FLEXArcGIS API for FLEX•• What is Flash?What is Flash?•• Using FlexUsing Flex•• ArcGIS API for FlexArcGIS API for Flex•• Getting StartedGetting Started•• Flex Sample ViewerFlex Sample Viewer
![Page 48: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/48.jpg)
Step 1: Get FlexStep 1: Get Flex
•• Available as download from AdobeAvailable as download from Adobe•• 60 day eval period60 day eval period
![Page 49: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/49.jpg)
Step 2: Product Home Page Step 2: Product Home Page
•• Address:Address:–– http://resources.esri.com/arcgisserver/apis/flexhttp://resources.esri.com/arcgisserver/apis/flex
•• API DownloadAPI Download•• DocumentationDocumentation•• SamplesSamples
![Page 50: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/50.jpg)
Step 3: Other StuffStep 3: Other Stuff
•• Scalenine.comScalenine.com•• Component ExplorerComponent Explorer•• crossdomain.xmlcrossdomain.xml
![Page 51: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/51.jpg)
AgendaAgenda
•• IntroductionIntroduction
•• ArcGIS Javascript APIArcGIS Javascript API
•• ArcGIS API for FLEXArcGIS API for FLEX•• What is Flash?What is Flash?•• Using FlexUsing Flex•• ArcGIS API for FlexArcGIS API for Flex•• Getting StartedGetting Started•• Flex Sample ViewerFlex Sample Viewer
![Page 52: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/52.jpg)
Flex Sample ViewerFlex Sample Viewer•• TemplateTemplate•• Available in two forms:Available in two forms:
–– CompiledCompiled–– Source codeSource code……
![Page 53: Building Mashups Using the ArcGIS APIs for FLEX and ... Server Functions • Maps –Tiled Maps • Cached • Accesses tiles from a cache instead of dynamically rendering images](https://reader031.vdocuments.site/reader031/viewer/2022013014/5afacb5f7f8b9abd588ec267/html5/thumbnails/53.jpg)
Thank you for attending.Thank you for attending.Please fill out a session survey.Please fill out a session survey.
Questions?Questions?