Developing Applications with ArcGIS Server Using Developing Applications with ArcGIS Server Using the Microsoft .NET Frameworkthe Microsoft .NET Framework

Mark HoMark HoKevin DeegeKevin Deege

AgendaAgenda

•• Introduction to the Web ADFIntroduction to the Web ADF•• Web ControlsWeb Controls•• Extending the Toolbar ControlExtending the Toolbar Control•• Developer APIDeveloper API’’ss•• Web ADF TasksWeb ADF Tasks•• Highlights of 9.3.1Highlights of 9.3.1•• Q & AQ & A

AuthorAuthor

ServeServe

UseUse

ArcGIS Server

ArcGIS Desktop

ArcGIS Server 9.3ArcGIS Server 9.3Complete and Interoperable ServerComplete and Interoperable Server--Based GISBased GIS

GIS on the Web in 3 stepsGIS on the Web in 3 steps

Author GIS contentAuthor GIS content–– Create GIS resourcesCreate GIS resources–– ArcGIS Desktop applicationsArcGIS Desktop applicationsPublish contentPublish content–– Publish GIS resources as servicesPublish GIS resources as services–– ArcCatalog and ArcGIS ArcCatalog and ArcGIS

Server ManagerServer ManagerUse GIS servicesUse GIS services–– Web mapping applicationsWeb mapping applications–– ArcGIS ExplorerArcGIS Explorer–– ArcGIS DesktopArcGIS Desktop–– Many othersMany others

GIS Services are created from GIS ResourcesGIS Services are created from GIS Resources

Service typeService type Published usingPublished using

MapMap Map document (.mxd or .pmf)Map document (.mxd or .pmf)

GlobeGlobe Globe document (.3dd)Globe document (.3dd)

GeocodeGeocode Locator (.loc file or geodatabase)Locator (.loc file or geodatabase)

GeodataGeodata Geodatabase connection (.sde) or Map Geodatabase connection (.sde) or Map document with geodatabase layerdocument with geodatabase layer

GeoprocessingGeoprocessing Toolbox (.tbx) or Map document (.mxd) with Toolbox (.tbx) or Map document (.mxd) with tool layertool layer

ImageImage Raster dataset or layer file (.lyr) or image Raster dataset or layer file (.lyr) or image service file (.iscdef)service file (.iscdef)

ArcGISArcGISServerServer

Web Map AppWeb Map App

RESTWeb ADF

SilverLight FlexJavaScript

ArcGIS Server Web Development ArcGIS Server Web Development Options for building web clientsOptions for building web clients

Web ADF Development 101Web ADF Development 101What do you need to know?What do you need to know?

•• Client and Server side web developmentClient and Server side web development–– ASP.NET (C#, VB.NET)ASP.NET (C#, VB.NET)–– HTML/CSSHTML/CSS–– ASP.NET AJAXASP.NET AJAX

•• Partial PostbacksPartial Postbacks•• JavascriptJavascript•• Application ServicesApplication Services

•• Familiar with IISFamiliar with IIS–– Performance, Scalability, ASP.NET worker processPerformance, Scalability, ASP.NET worker process

•• Web server (IIS)Web server (IIS)•• Visual Studio .NET Visual Studio .NET

–– 2005/20082005/2008–– .NET Framework.NET Framework–– 2.0/3.0/3.52.0/3.0/3.5

•• ASP.NET AJAX extensionsASP.NET AJAX extensions•• Web Application Development Framework (ADF)Web Application Development Framework (ADF)•• Access to GIS server requiredAccess to GIS server required

–– Local or remoteLocal or remote

Web ADF Development 101Web ADF Development 101Development ConfigurationDevelopment Configuration

•• Developer SDKDeveloper SDK’’ss•• Sample GIS ServerSample GIS Server•• ArcGIS OnlineArcGIS Online•• Online HelpOnline Help•• CommunityCommunity

–– Blogs & ForumsBlogs & Forums–– Code GalleryCode Gallery

•• SupportSupport–– Knowledge BaseKnowledge Base–– Software updatesSoftware updates

http://resources.esri.comhttp://resources.esri.com

ArcGIS Resource CentersArcGIS Resource CentersDeveloper Help Developer Help

DEMODEMO

ArcGIS Server Resource CenterArcGIS Server Resource Center

Introducing the Web Application Developer Framework Introducing the Web Application Developer Framework (ADF)(ADF)

•• .NET libraries used to build GIS Web applications.NET libraries used to build GIS Web applications•• Web ADF JavascriptWeb ADF Javascript•• Web controlsWeb controls

–– Mapping, resource management, multiMapping, resource management, multi--sourcesource–– AJAX enabledAJAX enabled

•• Task frameworkTask framework–– Extensible ArchitectureExtensible Architecture

•• Visual Studio integration (2005 and 2008)Visual Studio integration (2005 and 2008)–– Toolbox panelToolbox panel–– Context menusContext menus–– Developer HelpDeveloper Help–– Developer SamplesDeveloper Samples–– Web Mapping Application templateWeb Mapping Application template

Web Application Developer FrameworkWeb Application Developer FrameworkWeb Application Developer Framework

Web ADF developer librariesWeb ADF developer libraries

•• AssembliesAssemblies–– Web ADF (native .NET)Web ADF (native .NET)–– ArcObjects (COM Interop)ArcObjects (COM Interop)

•• ArcObjects COM type librariesArcObjects COM type libraries

Web ADF ControlsWeb ADF Controls

•• AJAX enabledAJAX enabled•• MultiMulti--source consolidationsource consolidation

–– Resource blendingResource blending•• Rich outRich out--ofof--thethe--boxbox

functionality functionality

•• Visual Studio integrationVisual Studio integration

Web ADF JavaScriptWeb ADF JavaScript

•• Enhances the Web ADF Web Controls and FrameworkEnhances the Web ADF Web Controls and Framework–– Client side functionality and behaviorsClient side functionality and behaviors

•• Built using ASP.NET AJAX as the base client libraryBuilt using ASP.NET AJAX as the base client library–– Support for well known MS AJAX PatternsSupport for well known MS AJAX Patterns–– Documention provided on MSDNDocumention provided on MSDN

•• Event DrivenEvent Driven–– Respond to map events directly in browser using a Scriptable MapRespond to map events directly in browser using a Scriptable Map

ControlControl•• Object OrientedObject Oriented

–– Full object model and SDK detailing how to use itFull object model and SDK detailing how to use it

ASP.NET AJAX and 9.3ASP.NET AJAX and 9.3

Web ADF JavaScript files

ArcGIS Server .NET Web ADF

Microsoft .NET Framework

Client-side Server-side

Web ADFJavaScript Library

Microsoft .NET FrameworkMicrosoft AJAX Library

ArcGIS Server .NET Web ADF

Microsoft ASP.NET AJAX

9.29.29.39.3

Web ADF Data SourcesWeb ADF Data Sources

•• Generic framework for supporting multiple ServicesGeneric framework for supporting multiple Services•• Manages interaction between Web controls and data sourcesManages interaction between Web controls and data sources•• Extensible architectureExtensible architecture

Web ADF GraphicsWeb ADF Graphics

•• Drawn on top of layers in the mapDrawn on top of layers in the map• Used to perform tasks such as:

– Highlighting features (select)– Labeling text– Displaying buffers– Geocoding– Displaying dynamic data (GPS)

•• Rendering occurs independently from the mapRendering occurs independently from the map

–– Does not require a map redrawDoes not require a map redraw

Web ADF TasksWeb ADF Tasks

•• Visual componentsVisual components•• Perform set of related actionsPerform set of related actions•• Generate resultsGenerate results•• Encapsulate workflowEncapsulate workflow

–– Provide user interface (UI)Provide user interface (UI)for gathering inputfor gathering input

–– Perform some action based on inputsPerform some action based on inputs–– Generate resultsGenerate results

The ADF Task FrameworkThe ADF Task Framework

•• Framework provides for:Framework provides for:–– Configuring tasks in VS.NET and ManagerConfiguring tasks in VS.NET and Manager–– Organization of tasksOrganization of tasks–– Feedback when a task is executingFeedback when a task is executing–– Management of resultsManagement of results

•• DisplayDisplay•• Visualization on MapVisualization on Map•• Delete, Refresh, ReDelete, Refresh, Re--runrun

–– Distributable UI componentsDistributable UI components•• Plugs into ManagerPlugs into Manager

•• ExtensibleExtensible

CustomTask

Visual S

tudio

Visual S

tudio

Manager

Manager

Web ADF development paths Web ADF development paths

•• Web Mapping Application TemplateWeb Mapping Application Template

•• Web ADF Web controlsWeb ADF Web controls

•• Developer APIDeveloper API’’ss–– Common data source APICommon data source API–– SOAPSOAP–– ArcObjectsArcObjects

•• ArcGIS Server Manager ArcGIS Server Manager –– Set required parametersSet required parameters–– Map, table of contentsMap, table of contents–– Theme, hyperlinksTheme, hyperlinks–– Can modify in Visual StudioCan modify in Visual Studio

•• Visual Studio template Visual Studio template –– Same files as Same files as

ArcGIS Server ManagerArcGIS Server Manager•• ASP.NET Web SiteASP.NET Web Site

–– Create with Web ControlsCreate with Web Controls

Options for creating Web ADF applicationsOptions for creating Web ADF applications

Advantages of using the templateAdvantages of using the template

•• Start with a complete Start with a complete GIS Web applicationGIS Web application

•• The template provides: The template provides: –– Measure user controlMeasure user control–– Identify toolIdentify tool–– Layout DIVs Layout DIVs –– resize, etc.resize, etc.–– Docking itemsDocking items–– ThemesThemes–– Help systemHelp system

•• Property settingsProperty settings–– Assigned in web.configAssigned in web.config

•• Stored in App_ThemesStored in App_Themes

•• ComponentsComponents–– ImagesImages–– Skins (.skin)Skins (.skin)–– Cascading Style Sheets (CSS)Cascading Style Sheets (CSS)

Web Mapping Application TemplateWeb Mapping Application TemplateThemesThemes

DEMODEMO

Web Mapping Application Web Mapping Application

Getting started with Web ADF controlsGetting started with Web ADF controls

•• Resource manager controlsResource manager controls–– Not visible at run timeNot visible at run time–– Manage resourcesManage resources

•• Mapping controlsMapping controls–– MapMap–– Overview mapOverview map

•• Related controlsRelated controls–– ToolbarToolbar–– Table of contentsTable of contents

Map resource managerMap resource manager

•• Manages a collection of resource itemsManages a collection of resource items–– Resource definitionResource definition

•• Name displays in the table of contentsName displays in the table of contents•• Type determines the Type determines the

data sourcedata source–– Display settingsDisplay settings

•• TransparencyTransparency•• Background colorBackground color•• Request MIME dataRequest MIME data

Map controlMap control

•• Associate with a Map resource manager controlAssociate with a Map resource manager control•• Works with multiple map resourcesWorks with multiple map resources

–– Create dynamic map imagesCreate dynamic map images–– Fetch preFetch pre--generated image tilesgenerated image tiles

(cached services)(cached services)•• Image blendingImage blending

–– Web tier or browser Web tier or browser •• GameGame--style navigationstyle navigation

–– Seamless pan and zoomSeamless pan and zoom–– Keyboard and mouse integrationKeyboard and mouse integration

Toolbar controlToolbar control

•• Contains collection of toolbar itemsContains collection of toolbar items–– ToolTool–– CommandCommand–– DropDownBoxDropDownBox–– SeparatorSeparator–– SpaceSpace

•• At run time, displays collection of toolsAt run time, displays collection of tools–– OutOut--ofof--thethe--boxbox–– CustomCustom

•• Buddy with Map or PageLayout controlBuddy with Map or PageLayout control

Toc controlToc control

•• Lists map layers Lists map layers •• Supports multiple data sourcesSupports multiple data sources•• Buddy with Map or PageLayout controlBuddy with Map or PageLayout control•• Inherits TreeViewPlus controlInherits TreeViewPlus control

–– Supports Extensible Markup Supports Extensible Markup Language (XML) databindingLanguage (XML) databinding

•• AsynchronousAsynchronous

OverviewMap controlOverviewMap control

•• Shows interactive area of interestShows interactive area of interest•• Displays GIS resourcesDisplays GIS resources

–– Can differ from mapCan differ from map•• StaticMode booleanStaticMode boolean

–– True: ReTrue: Re--use map imageuse map image–– False: Regenerate map imageFalse: Regenerate map image

•• Buddy with a Map controlBuddy with a Map control–– Uses a MapResourceManagerUses a MapResourceManager–– Same spatial referenceSame spatial reference

OverviewMap control

Map control

MapTips control MapTips control

•• Displays attributesDisplays attributes•• Creates interactive graphicsCreates interactive graphics•• Map service must return geometryMap service must return geometry

–– Points, lines, polygonsPoints, lines, polygons•• Works withWorks with

–– ArcGIS ServerArcGIS Server–– ArcIMSArcIMS–– Web ADF graphicsWeb ADF graphics

•• Buddy with Map controlBuddy with Map control

ContextMenu controlContextMenu control

•• Associate with any element in the pageAssociate with any element in the page•• Set ContextMenu propertiesSet ContextMenu properties

–– BackColor makes control visible at runtimeBackColor makes control visible at runtime–– Other properties are optionalOther properties are optional

•• Write code to:Write code to:–– Add context menu itemsAdd context menu items–– Show context menu at runtimeShow context menu at runtime–– Handle click eventHandle click event

Design time

Run time

Other controls Other controls

•• FloatingPanelFloatingPanel–– Container for other Web controlsContainer for other Web controls–– Rendered as CSS in browserRendered as CSS in browser

•• MagnifierMagnifier–– Floating window over Map controlFloating window over Map control–– Zoom to main mapZoom to main map

•• ZoomLevelZoomLevel–– PrePre--defined map scale intervalsdefined map scale intervals–– Cached and dynamic servicesCached and dynamic services

•• NavigationNavigation–– PrePre--defined pan speeddefined pan speed

DEMODEMO

Web ADF Web ControlsWeb ADF Web Controls

Working with the Web ADF JavaScript LibraryWorking with the Web ADF JavaScript Library

•• Public script API of Web ADF controlsPublic script API of Web ADF controls•• Built on Microsoft ASP.NET AJAXBuilt on Microsoft ASP.NET AJAX•• Web ADF server controls are scriptableWeb ADF server controls are scriptable

–– Represented in JavaScript as componentsRepresented in JavaScript as components–– Use JavaScript to interact with control on the clientUse JavaScript to interact with control on the client--sideside

•• ClientClient--side object modelside object model–– GeometryGeometry–– SymbologySymbology–– Layers (serverLayers (server--side and clientside and client--side)side)–– Callouts and MapTipsCallouts and MapTips

Getting started with the Map client controlGetting started with the Map client control

•• Access the Map using JavaScriptAccess the Map using JavaScript

•• Set properties (get_ and set_)Set properties (get_ and set_)–– extent, mouseMode, layersextent, mouseMode, layers

•• Call functionsCall functions–– Navigation: zoom, zoomTo, panToNavigation: zoom, zoomTo, panTo–– Graphics: addGraphic, removeGraphicGraphics: addGraphic, removeGraphic–– Geometry: getGeometryGeometry: getGeometry

•• Event handlers (add_event, remove_event)Event handlers (add_event, remove_event)–– click, extentChanged, onProgressclick, extentChanged, onProgress

Web ADF JavaScript ExamplesWeb ADF JavaScript Examples

•• Get the map object and add an event listenerGet the map object and add an event listener

•• Center map on a pointCenter map on a pointvar center = new ESRI.Geometries.Point(100,0)map.panTo(center);

Web ADF JavaScript OMDWeb ADF JavaScript OMD

var map = $find('Map1'); MapControl ID var scaleFactor = 2;var centerPoint = new ESRI.ADF.Geometries.Point(-110, 45);var useAnimation = true;map.zoom(scaleFactor, centerPoint, useAnimation);

DEMODEMO

Web ADF JavaScriptWeb ADF JavaScript

4040

Developer APIDeveloper API’’s s –– Common Data SourceCommon Data Source

•• ArcGIS Server supports multiple data sourcesArcGIS Server supports multiple data sources–– ArcGIS Server, ArcIMS, ArcWeb services, OGC, GraphicsArcGIS Server, ArcIMS, ArcWeb services, OGC, Graphics

•• Common Datasource APICommon Datasource API–– Pure .NET classes for the Web ADFPure .NET classes for the Web ADF–– Access and interact with all data sources the same wayAccess and interact with all data sources the same way

•• Provides different functionalities Provides different functionalities -- query, find, identityquery, find, identity……

Common data source API

Advantages of the Common Data Source APIAdvantages of the Common Data Source API

•• Removes business and GIS logic from Web controlsRemoves business and GIS logic from Web controls•• Support for multiple data sources using the same APISupport for multiple data sources using the same API•• Easy to program against different data sources Easy to program against different data sources •• Implement your own custom data sourcesImplement your own custom data sources

Data sourceData source--specific APIsspecific APIs

•• Support for data source specific capabilitiesSupport for data source specific capabilities–– ArcGIS ServerArcGIS Server–– ArcIMSArcIMS–– ArcWeb ServicesArcWeb Services

•• Example: ArcObjects APIExample: ArcObjects API–– Access to the fineAccess to the fine--grained ArcObjectsgrained ArcObjects

•• What does this mean?What does this mean?–– Many other data sourceMany other data source--

specific classes availablespecific classes available–– More business/GIS logicMore business/GIS logic–– Different APIs use different communication protocolsDifferent APIs use different communication protocols–– Requires different programming patterns for each data sourceRequires different programming patterns for each data source

ESRI.ArcGIS.ADF.IMS.dll

ESRI.ArcGIS.ADF.ArcWebService.dll

ESRI.ArcGIS.ADF.ArcGISServer.dll

Extending the Web ADF toolbarExtending the Web ADF toolbar

•• Toolbar items execute client and server actions Toolbar items execute client and server actions

•• Command (like a button)Command (like a button)–– A click invokes server actionA click invokes server action

•• DropDrop--down boxdown box–– Select item to invoke server actionSelect item to invoke server action–– List layer names, data frames, etc.List layer names, data frames, etc.

•• ToolTool–– ClientClient--side action: Action performed in Web browserside action: Action performed in Web browser–– ServerServer--side action: Class to handle server tool actionside action: Class to handle server tool action

Creating a custom tool

1. Make a toolbar2. Add controls to it3. Choose a JavaScript for client-side action, if needed4. Create a class for the control’s server-side code5. Set control’s properties to connect to its client and server code

Creating controls on a toolbar

• Toolbar properties• ToolbarItems property• The Add button

– Items to Contents– Builds the toolbar

Define ClientDefine Client--side Actionside Action

•• The user The user ‘‘drawsdraws’’ a shape with the toola shape with the tool•• You decide which shape by setting ClientAction propertyYou decide which shape by setting ClientAction property

–– RectangleRectangle–– LineLine–– PointPoint–– PolygonPolygon–– CircleCircle–– OvalOval

Writing code for your toolWriting code for your tool

•• Create a class in App_code folder for the server actionCreate a class in App_code folder for the server action•• Implement IMapServerToolActionImplement IMapServerToolAction•• Use args paramater to get the MapUse args paramater to get the Map

Sub ServerAction(ByVal args as ToolEventArgs)

Dim map as Map = CType(args.Control,Map)Dim pargs as PointEventArgs = CType(args,PointEventArgs)map.CenterAt(pargs.ScreenPoint)

End Sub

Sub ServerAction(ByVal args as ToolEventArgs)

Dim map as Map = CType(args.Control,Map)Dim pargs as PointEventArgs = CType(args,PointEventArgs)map.CenterAt(pargs.ScreenPoint)

End Sub

Associating the code (the class) to a controlAssociating the code (the class) to a control

•• ToolbarItemsCollectionEditorToolbarItemsCollectionEditor•• Show PropertiesShow Properties•• ServerActionAssemblyServerActionAssembly•• ServerActionClassServerActionClass

DEMODEMO

Extending the Web ADF ToolbarExtending the Web ADF Toolbar

Leveraging the task frameworkLeveraging the task framework

•• Page developerPage developer–– Use outUse out--ofof--thethe--box tasksbox tasks–– Add results directly to Add results directly to

TaskResults container TaskResults container •• Custom toolsCustom tools

–– Create User controlCreate User control•• Server control developerServer control developer

–– Extend existing tasks to modify Extend existing tasks to modify behaviorbehavior

–– Develop custom task to distribute Develop custom task to distribute and integrate with ArcGIS and integrate with ArcGIS Server ManagerServer Manager

CustomActions/Events

Out-of-the-box Web controls

Page developer

Page/Web control events

User controls

Composite Web controls

Extend Web controls

Server control developer

Tasks included with the ADFTasks included with the ADF

•• Configure without writing codeConfigure without writing code–– Similar to ArcGIS Server ManagerSimilar to ArcGIS Server Manager

•• Common tasksCommon tasks–– Search AttributesSearch Attributes–– Query AttributesQuery Attributes–– PrintPrint–– Find AddressFind Address

•• ResourceResource--specific tasksspecific tasks–– Find PlaceFind Place–– GeoprocessingGeoprocessing–– EditorEditor

TaskManager controlTaskManager control

•• Organizes tasks in a Web applicationOrganizes tasks in a Web application•• Generates hierarchical XML at run timeGenerates hierarchical XML at run time

–– XML can be bound to ASP.NET menu or tree viewXML can be bound to ASP.NET menu or tree view–– BuddyControl property controls bindingBuddyControl property controls binding

XML + System.Web.UI.WebControls.Menu

=

Run timeDesign time

TaskResults controlTaskResults control

•• Displays task results as nodes in tree viewDisplays task results as nodes in tree view•• Draws results in a mapDraws results in a map•• Produces interactive resultsProduces interactive results

–– Highlight feature as result setHighlight feature as result set–– Zoom or pan to featureZoom or pan to feature–– ReRe--run taskrun task–– Remove task resultsRemove task results

•• Handles events for nodesHandles events for nodes–– Add, click, select, remove Add, click, select, remove

Custom Web Task ImplementationCustom Web Task Implementation

•• Basic task implements ITaskBasic task implements ITask•• Create a custom Web control Create a custom Web control

–– Extend Task or FloatingPanelTask abstract base classesExtend Task or FloatingPanelTask abstract base classes

ESRI.ArcGIS.ADF.Web.UI.WebControls ESRI.ArcGIS.ADF.Web.UI.WebControls FloatingPanelFloatingPanel

ESRI.ArcGIS.ADF.Web.UI.WebControls ESRI.ArcGIS.ADF.Web.UI.WebControls FloatingPanelTaskFloatingPanelTask

CustomTaskCustomTask

ICallbackEventHandlerICallbackEventHandler

IBuddyControlSupportIBuddyControlSupport

ITaskITask

ASP.NET Web ControlsASP.NET Web Controls

DEMODEMO

Web ADF Task FrameworkWeb ADF Task Framework

WhatWhat’’s New at 9.3.1s New at 9.3.1

•• Map Tips templatesMap Tips templates•• Additional ResourcesAdditional Resources

–– Image ServerImage Server–– Virtual EarthVirtual Earth

•• User Control TasksUser Control Tasks•• Print Task templatesPrint Task templates•• Manager CustomizationManager Customization

–– Custom PanelsCustom Panels

Additional ResourcesAdditional Resources

•• Developer Summit ProceedingsDeveloper Summit Proceedings–– Archived recordings and presentationsArchived recordings and presentations–– http://gis.esri.com/library/userconf/devsummit08/index.html http://gis.esri.com/library/userconf/devsummit08/index.html

•• ArcGIS 9.3 OnArcGIS 9.3 On--line Seminarsline Seminars–– View a free Live Training Seminar or watch the recordingView a free Live Training Seminar or watch the recording–– www.esri.com/ltswww.esri.com/lts

•• ArcGIS Server TrainingArcGIS Server Training–– Introduction to ArcGIS ServerIntroduction to ArcGIS Server–– Developing Applications with ArcGIS Server for the Microsoft .NEDeveloping Applications with ArcGIS Server for the Microsoft .NET T

FrameworkFramework–– www.esri.com/trainingwww.esri.com/training

Questions and AnswersQuestions and Answers

Please fill out your evaluationsPlease fill out your evaluations