developing a gis portal using the flex api
DESCRIPTION
2009 Ohio GIS Conference September 17, 2009. Developing a GIS Portal Using the Flex API. Joe LaCombe System Architect Woolpert, Inc. What I will talk about…. What is Flex? What is the ArcGIS Server Flex API? Discuss ESRI’s Sample Viewer and the widget programming model - PowerPoint PPT PresentationTRANSCRIPT
Developing a GIS Portal Using the Flex API
2009 Ohio GIS Conference
September 17, 2009
Joe LaCombeSystem ArchitectWoolpert, Inc.
What I will talk about…What I will talk about…
• What is Flex? • What is the ArcGIS Server Flex API?• Discuss ESRI’s Sample Viewer and the
widget programming model• Case Study: Extending the Sample Flex
Viewer• Integration with other platforms - Show
how you can consume .Net WCF services via REST from the Flex environment
• Benefits of Flex• How it compares with other API’s?
What is Flex?What is Flex?
• Adobe Flex is a software development kit released by Adobe Systems for the development and deployment of cross-platform rich Internet applications based on the Adobe Flash platform. Flex applications can be written using Adobe Flex Builder or by using the freely available Flex compiler from Adobe
What is Flex?What is Flex?
Flex = .NetMXML = HTMLActionScript = JavaScript + VB/C#
Flex Development Kit
MXML Markup
ActionScript scripting/core programming
OR
.SWF file
Flex Development Flex Development EnvironmentEnvironment• Adobe Flex Builder
– Built upon eclipse– Could develop in notepad, use Adobe’s
free compiler– Various open source IDE’s, even a plug-
in for Visual Studio– But, Flex Builder is the recommended
option– Relatively cheap
ArcGIS Server Flex APIArcGIS Server Flex API
HTTP/JSON
HTTP/XML
DCOM
ArcGIS Server Flex APIArcGIS Server Flex API
• http://resources.esri.com/arcgisserver/apis/flex/index.cfm?fa=home– Samples– API Reference– Community/Code Gallery– Sample Viewer
Sample Flex ViewerSample Flex Viewer
• FlexViewerDevelopersGuide.pdf• Provided by a group from ESRI but ESRI
“technically” does not support• Nice looking GUI Widget programming
model• Architected efficiently and in a way so
don’t need to worry about the plumbing• Easy to extend
Sample Flex ViewerSample Flex Viewer
• liberates programmers from having to deal with:– the programming complexity of managing maps– map navigation– application configuration– inter-component communication– data management, etc.
• focus their time and effort on implementing core business functions in their custom applications.
• quickly develop/deploy customizations into existing Sample Flex Viewer applications in the form of widgets
• Add a configuration entry into the Sample Flex Viewer application’s configuration file.
Case Study: Northern Kentucky Case Study: Northern Kentucky Area Planning Commission Area Planning Commission (NKAPC) (NKAPC) • Objective: rewrite/combine
existing ArcIMS websites into one portal
LinkGIS ViewerLinkGIS Viewer
Presentation Tier
Business Logic Tier
Data Tier
LinkGIS ViewerLinkGIS Viewer
Based on ESRI’s Sample Flex Viewer
GIS Layer Display
Graphic Operations
Printing
Data Retrieval
Data Retrieval
Flood Hazard Analysis
Widget–based Approach: Mapping Portal
.Net Web
Services
SDE
Consume .Net ServicesConsume .Net Services
• Printing– ArcMap based layout ArcObjects– Provide map description, graphics as JSON – Web service does the work– Return URL to viewer
• Flood Plain Analysis– ArcObjects performs spatial analysis– Populate FEMA PDF form with GIS attributes– Return determination and URL to viewer as JSON
• Search– Full-text indexing on specific layer table columns– Configuration tells search service what tables/indexes
to search based upon parameters– Return results as JSON
Consume .Net ServicesConsume .Net Services• Various options
– SOAP XML– HTTP Get, Post, etc. REST/WCF Services
• XML• JSON(JavaScript Object Notation)
JSON
XML
Why JSON?Why JSON?
• JSON has much smaller grammar • JSON is processed more easily because its structure
is simpler• XML translates the structure of the data into a
document structure. This mapping can be complicated. JSON structures are based on arrays and records. That is what data is made of.
• Maps more directly onto the data structures used in modern programming languages, i.e. JavaScript/ActionScript Objects
Consume .Net ServicesConsume .Net Services
•REST/WCF via JSON
Consume .Net ServicesConsume .Net Services
•Decode results
Benefits of Flex Benefits of Flex
• Rich Internet Applications (RIA) rich functionality and enhanced user experience
• Browser independent runs in Flash Player (Web) or AIR (Desktop)
• Stable, mature product • Flex provides efficient integration with a
variety of systems, data, and technologies• Modular development approach
– Each component is a separate Flash file(.swf)– “Flexible” architecture results in more
extendable applications– Perfect for building portals and dashboards
• It works!
Other API’sOther API’s
• Flex, Silverlight, or JavaScript?– All have their pros/cons– 9.4 to have templates of each to start from– Whichever one you are comfortable with
Questions?Questions?
Contact InformationContact Information
Joe LaCombeSystem ArchitectWoolpert, [email protected]