Using and Extending the ArcGIS WebMap for Flexg g

Bjorn SvenssonBjorn SvenssonMoxie Zhang (replaced by Mansour Raad)

AgendaAgendaAgendaAgenda

•• Introduce outIntroduce out--ofof--thethe--box configurable web mapping box configurable web mapping applicationapplication

–– the new “Flex Viewer”the new “Flex Viewer”–– ArcGIS Application for FlexArcGIS Application for Flex–– Easy to extendEasy to extend

•• Describing the application “framework”Describing the application “framework”

Sample Flex ViewerSample Flex Viewer --> ArcGIS Application for Flex> ArcGIS Application for FlexSample Flex Viewer Sample Flex Viewer --> ArcGIS Application for Flex> ArcGIS Application for Flex

•• Same conceptsSame concepts

•• Minor changes to configuration filesMinor changes to configuration files•• Minor changes to configuration filesMinor changes to configuration files

•• Built on Flex 4, thus requires Flash Player 10 or above.Built on Flex 4, thus requires Flash Player 10 or above.

ArcGIS Web Mapping APIsArcGIS Web Mapping APIsArcGIS Web Mapping APIsArcGIS Web Mapping APIsBuilding Web clientsBuilding Web clients

•• ESRI offers APIs forESRI offers APIs for–– JavaScriptJavaScript–– FlexFlex

Ad bAd b–– SilverlightSilverlight

AdobeAdobe

•• Provide a comprehensive framework for creating GIS Provide a comprehensive framework for creating GIS enabled Web mapping applicationsenabled Web mapping applications

–– Fully support ArcGIS Server functionality and servicesFully support ArcGIS Server functionality and servicesy pp yy pp y–– Also work with ArcGIS Online servicesAlso work with ArcGIS Online services

P i il d t d d lP i il d t d d l•• Primarily geared towards developersPrimarily geared towards developers

ArcGIS Application for FlexArcGIS Application for FlexArcGIS Application for FlexArcGIS Application for Flex“Out“Out--ofof--thethe--box” Web applicationbox” Web application

•• ESRI solution for creating GIS enabled Web mapping ESRI solution for creating GIS enabled Web mapping applications, applications, without requiring programmingwithout requiring programming

•• Designed with the “nonDesigned with the “non--developer” in minddeveloper” in mindDesigned with the nonDesigned with the non developer in minddeveloper in mind

•• Builds upon and enhances the successful Builds upon and enhances the successful Sample Flex Sample Flex ViewerViewer

–– Most popular Flex API code gallery sampleMost popular Flex API code gallery sample•• Download from theDownload from the ESRI Resource CenterESRI Resource CenterDownload from the Download from the ESRI Resource CenterESRI Resource Center•• Application source code is availableApplication source code is available•• Strong communityStrong community

•• Developed by the ESRI core development teamDeveloped by the ESRI core development team•• Technical Support availableTechnical Support available•• Technical Support availableTechnical Support available

ArcGIS Application for FlexArcGIS Application for FlexArcGIS Application for FlexArcGIS Application for FlexCapabilitiesCapabilities

•• Enables GIS Web mapping applications to be built easilyEnables GIS Web mapping applications to be built easilyand quicklyand quickly

–– Uses a ‘Uses a ‘configure and deployconfigure and deploy’ approach’ approachg p yg p y pppp–– Supports Supports basemapsbasemaps and operational layersand operational layers

•• Configurable Web Map applicationConfigurable Web Map application•• Configurable Web Map applicationConfigurable Web Map application–– Configuration files enable changes toConfiguration files enable changes to

•• AppearanceAppearance•• Functionality (via widgets)Functionality (via widgets)•• Data contentData content

•• Widgets Widgets → → modular functionalitymodular functionality–– Extensible programming model includedExtensible programming model included

Workflow comparisonWorkflow comparisonWorkflow comparisonWorkflow comparison

•• Web Mapping APIsWeb Mapping APIs

DownloadDownload DevelopDevelop DeployDeploy

A GIS A li i f FlA GIS A li i f Fl

API libraryAPI librarypp p yp y

Use integrated developmentenvironment (IDE)

•• ArcGIS Application for FlexArcGIS Application for Flex

DownloadDownload ConfigureConfigure DeployDeploy

Use text editorWeb MapWeb Map

gg p yp y

Authors of the Flex ApplicationAuthors of the Flex ApplicationAuthors of the Flex ApplicationAuthors of the Flex Application

•• NonNon--developersdevelopers–– Configure the application without programmingConfigure the application without programming–– Leverage existing widgetsLeverage existing widgetsg g gg g g–– Create Web applications that access ArcGIS servicesCreate Web applications that access ArcGIS services

D lD l•• DevelopersDevelopers–– Focused group of users (e.g., business partners)Focused group of users (e.g., business partners)–– Extend application functionalityExtend application functionalitypp ypp y

•• Change behavior of existing widgetsChange behavior of existing widgets•• Create new widgetsCreate new widgets

Application componentsApplication components WidgetsApplication componentsApplication components g

Map Switcher

Header Controller

Overview Map

Supported geographic contentSupported geographic contentSupported geographic contentSupported geographic content

ArcGIS Web Map for Flexp

Cached MapServices

ImageServicesDynamic Map

ServicesBingMaps

ArcIMSServices(image)

GeoRSS

ArcGIS Web Map for Flex functionalityArcGIS Web Map for Flex functionalityArcGIS Web Map for Flex functionalityArcGIS Web Map for Flex functionalityBased on WidgetsBased on Widgets

•• Application functionality defined by widgetsApplication functionality defined by widgets

•• Several widgets included with applicationSeveral widgets included with application•• Several widgets included with applicationSeveral widgets included with application

•• Additional widgets available from the Widget GalleryAdditional widgets available from the Widget Gallery–– Ready to be used ‘outReady to be used ‘out--ofof--thethe--box’box’–– Code is available (in most cases)Code is available (in most cases)–– Configurable for use with your own servicesConfigurable for use with your own servicesConfigurable for use with your own servicesConfigurable for use with your own services–– Part of the ESRI Resource CenterPart of the ESRI Resource Center

Widget GalleryWidget GalleryWidget GalleryWidget Gallery

B M S it hB M S it h

Base Map Switcher

•• Base Map SwitcherBase Map Switcher•• Overview mapOverview map•• BookmarkBookmark

D /Sk t hD /Sk t h•• Draw/SketchDraw/Sketch•• EditingEditing•• SearchSearch

Bookmarks widget•• Quick PrintQuick Print•• Share MapShare Map•• Routing/Driving DirectionsRouting/Driving Directions

Bookmarks widget

•• ……

Overview map widget

Widget GalleryWidget Gallery –– Possible additionsPossible additionsWidget Gallery Widget Gallery Possible additionsPossible additions

•• Extract Data *Extract Data *•• High Quality Print *High Quality Print *•• Time SliderTime Slider•• Service Area/Closest FacilityService Area/Closest Facility•• Table of ContentsTable of Contents

Data extraction widget

System RequirementsSystem RequirementsSystem RequirementsSystem Requirements

•• Flex SDK 4.0Flex SDK 4.0•• Flash Player 10.0Flash Player 10.0

•• A text editor: Notepad, A text editor: Notepad, TextPadTextPad etcetc

•• For widget developers: Flash Builder 4.For widget developers: Flash Builder 4.

ArcGIS Web Map for FlexArcGIS Web Map for FlexArcGIS Web Map for FlexArcGIS Web Map for FlexBenefits and business value Benefits and business value

1.1. Business solutionBusiness solution–– Starting template to create custom Web mapping applicationsStarting template to create custom Web mapping applications–– Address specific business requirement needsAddress specific business requirement needsp qp q–– Simplify end user experienceSimplify end user experience

2.2. Application developmentApplication development–– Focus on developing functional solutions on an existing UIFocus on developing functional solutions on an existing UI

•• No need to reNo need to re--architect underlying frameworkarchitect underlying frameworky gy g–– Create new widgets to add functionality to the applicationCreate new widgets to add functionality to the application–– Low entry barrier to learn Flex API developmentLow entry barrier to learn Flex API development

SummarySummary –– ArcGIS Web Map for FlexArcGIS Web Map for FlexSummary Summary ArcGIS Web Map for FlexArcGIS Web Map for Flex

•• ESRI solution for creating GIS enabled Web maps,ESRI solution for creating GIS enabled Web maps,without requiring programmingwithout requiring programming

•• Designed with the “nonDesigned with the “non--developer” in minddeveloper” in mindDesigned with the nonDesigned with the non developer in minddeveloper in mind

•• Configurable Web Map applicationConfigurable Web Map application–– Enables GIS Web maps to be built easily and quicklyEnables GIS Web maps to be built easily and quickly–– Uses a ‘Uses a ‘configure and deployconfigure and deploy’ approach’ approach–– Includes an Includes an extensible widget programming modelextensible widget programming modelg p g gg p g g

•• Developed by the ESRI core development teamDeveloped by the ESRI core development teamT h i l S t il blT h i l S t il bl•• Technical Support availableTechnical Support available

DeploymentDeploymentDeploymentDeployment

Looking aheadLooking ahead

• Public beta early summer

• Final release summer 2010• Final release summer 2010

SummarySummarySummarySummary

•• Today we coveredToday we covered–– Configurable GIS Web mapping applicationConfigurable GIS Web mapping application–– Extendable Extendable –– all source code availableall source code available

Still have questions?Still have questions?

Other Flex SessionsOther Flex SessionsOther Flex Sessions… Other Flex Sessions…

•• Meet the Team Meet the Team –– Tue. 3/23, 6:00 Tue. 3/23, 6:00 –– 7:30 p.m. 7:30 p.m.

•• Technical SessionsTechnical Sessions–– Working with the ArcGIS API for FlexWorking with the ArcGIS API for Flex

W d 3/24 10 30W d 3/24 10 30 11 45 P i A (PSCC)11 45 P i A (PSCC)•• Wed. 3/24, 10:30amWed. 3/24, 10:30am--11:45am, Primrose A (PSCC)11:45am, Primrose A (PSCC)•• Thu. 3/25, 1:30pmThu. 3/25, 1:30pm--2:45pm, Pasadena/Ventura/Sierra2:45pm, Pasadena/Ventura/Sierra

–– Patterns and Best Practices for Building Applications with Patterns and Best Practices for Building Applications with ArcGIS API for FlexArcGIS API for Flex

•• Thu. 3/24, 10:15amThu. 3/24, 10:15am--11:30am, Pasadena/Ventura/Sierra11:30am, Pasadena/Ventura/Sierra

Please complete the session survey!Please complete the session survey!

Want to Learn More?Want to Learn More?Want to Learn More?Want to Learn More?ESRI and Adobe ResourcesESRI and Adobe Resources

•• ArcGIS Resource CenterArcGIS Resource Center––Samples, API Samples, API Reference, Concepts, CommunityReference, Concepts, Community

9 3:9 3: httphttp://resources esri com/arcgisserver/apis/flex://resources esri com/arcgisserver/apis/flex//9.3: 9.3: httphttp://resources.esri.com/arcgisserver/apis/flex://resources.esri.com/arcgisserver/apis/flex//10.0: 10.0: http://resources.arcgis.com/content/arcgishttp://resources.arcgis.com/content/arcgis--apiapi--flexflex

•• AdobeAdobe––Flex developer CenterFlex developer Center

http://www.adobe.com/devnet/flex/http://www.adobe.com/devnet/flex/

––Using Flex 4 SDKUsing Flex 4 SDKhttp://help.adobe.com/en_US/Flex/4.0/UsingSDK/index.htmlhttp://help.adobe.com/en_US/Flex/4.0/UsingSDK/index.html