News

ArcUser


Search ArcUser

Summer 2012 Edition

Creating Custom Web Mapping Applications without Programming

By Derek Law, Esri Product Management

This article as a PDF.

A web map created in the ArcGIS.com Map Viewer

A web map created in the ArcGIS.com Map Viewer

Web GIS is becoming an essential component of many GIS application solutions. From federal government agencies and corporate enterprise solutions to state/municipal governments and private organizations, a website presence with mapping capabilities is now very common.

ArcGIS for Server lets you share and publish your GIS resources on the web as web services. To work with these services, you can develop web client applications using the web mapping APIs for JavaScript, Flex, and Silverlight. This is a great technology workflow, but for organizations with limited developer resources, enabling GIS on the web can be challenging.

Esri has been making it much easier for ArcGIS users to create and deploy custom web mapping applications without programming. The objective has been to empower traditional desktop GIS analysts to easily create and deploy GIS application solutions on the web.

Three easy-to-use solutions for creating custom web mapping applications are available. All are designed to work with services from ArcGIS for Server and ArcGIS Online as well as ArcGIS Online web maps. They provide a means to easily configure and deploy custom web mapping applications without having to write a single line of code. They are ideal for nondevelopers and novice web mapping application creators. They can also be leveraged by developers working with web mapping APIs who can use these viewers as a starting point for building custom client applications.

ArcGIS.com web map sharing options

ArcGIS.com web map sharing options

The three configurable web client viewer options are ArcGIS Online application templates, ArcGIS Viewer for Flex, and ArcGIS Viewer for Silverlight. Each option was built on one of the three web mapping APIs for JavaScript, Flex, and Silverlight technologies. All enable you to easily configure and deploy a custom web mapping application. Each follows a similar design pattern: specify the web application's data content, then its functionality, and finally its appearance.

ArcGIS Online Application Templates

This is the simplest and easiest configurable client viewer option. All you need is an Internet connection so you can use the map viewer at ArcGIS Online, the online component of the ArcGIS system. No additional hardware, such as servers or other resources, is required.

With the map viewer, you can easily create your own interactive map. To create a custom web map, just select a basemap; combine additional data content, such as web services, shapefiles, Microsoft Excel spreadsheets, CSV files, or KML data; and specify data layer display properties such as pop-up dialogs. Essentially, you create a mashup of data from your own data sources and online data sources. Once complete, save it as an ArcGIS Online web map.

Gear icons indicate that these ArcGIS.com application templates are configurable.

Gear icons indicate that these ArcGIS.com application templates are configurable.

Your web map can be consumed by many different clients. It can be shared with the public or with members of one or more arcgis.com user groups. You can also share it via e-mail, Facebook, or Twitter or embed it in a website as an interactive map.

You have another sharing option. You can create a new web mapping application for the web map by using one of the web application templates available on ArcGIS Online for a variety of use cases. Approximately half these templates have some configuration options (indicated with a gray gear icon), and all were built using the ArcGIS API for JavaScript.

The web application template can be published to ArcGIS Online so the web application will be hosted on ArcGIS.com. Once published and shared, the newly created and deployed web application for your web map can be configured. Simply navigate to the web application's item page on ArcGIS Online and click the Configure App button on the web application template's configuration options.

Options for the Basic Viewer application template include turning on/off many of the viewer's capabilities such as the legend, print tool, and bookmarks. Some functionality, such as the Edit tool, will only be available if the web map contains editable data. The configuration options available will vary depending on the application template selected.

Alternatively, you can download the web application to your own machine as a ZIP file so you can host the web application on your own web server machine. Hosting the web application on premises lets you further customize it via JavaScript API development.

The basic ArcGIS Viewer for Flex application template configuration options

The basic ArcGIS Viewer for Flex application template configuration options

To learn more about ArcGIS Online application templates, navigate to the ArcGIS.com Resource Center.

ArcGIS Viewer for Flex

Originally released as the Sample Flex Viewer, this application became an official product in summer 2010. Built on the ArcGIS API for Flex, it is a ready-to-deploy, configurable, rich Internet application (RIA) that requires the Adobe Flash Player plug-in on your web browser. With it, you can easily customize and deploy a robust and interactive web mapping client hosted on your web server (e.g., Internet Information Server, or IIS). This configurable web client viewer option is more comprehensive than the ArcGIS Online application templates.

You start with the ArcGIS Viewer for Flex application builder, an Adobe Air application that installs on your local machine and executes as a desktop application. The application builder provides a wizard-like interface for configuring the viewer's properties. When the application builder is run for the first time, it will prompt you for a default location to deploy the new web applications it creates. Typically, this would be in the web server resources directory. To begin, simply click the Create a New Application button and provide a name for the application.

Use the ArcGIS Viewer for Flex application builder to choose basemaps and operational layers for an application

Use the ArcGIS Viewer for Flex application builder to choose basemaps and operational layers for an application

The application builder user interface consists of five control tabs that follow the general design pattern for configuring web applications. By navigating to each tab, you configure different aspects of the viewer. On the Maps tab, you specify the data content. This can be an ArcGIS Online web map or your own basemap and operational layers. On the Widgets tab, specific GIS functionality, such as drawing, editing, charting, geocoding, search, legend, geoprocessing, or printing, is defined. ArcGIS Viewer for Flex includes more than 20 core widgets that provide the common GIS functionalities needed in web mapping applications. On the Layout tab, you select which user interface controls (overview map, navigation tools, show coordinates) to include in the application. On the Design tab, you set the application's look and feel by adding a title, logo, or theme colors. The configuration workflow for a new application is nonlinear and dynamic, which is one of the application builder's strengths. For example, you can select the data content, define the functionality and appearance, and then go back and change the data content—there is no preset configuration workflow. You preview the final application with the Preview tab.

When you are finished, click Done to complete and deploy the new web application. The files that comprise the new web application are stored at the location specified when you first ran the application builder. The new web application can be accessed and used immediately in a web browser.

The ArcGIS Viewer for Flex application builder can also be used to manage the web mapping applications it has deployed. Web applications built on the ArcGIS Viewer for Flex can be further customized by directly configuring their XML configuration files. By making simple text edits to these XML files, you can apply more precise customization to your deployed web applications. Comprehensive documentation and samples for editing the viewer's XML configuration files are available online at the ArcGIS Viewer for Flex resource center. Learn more about the ArcGIS Viewer for Flex at links.esri.com/flexviewer.

The ArcGIS Viewer for Silverlight application builder steps the user through creation of a web application.

The ArcGIS Viewer for Silverlight application builder steps the user through creation of a web application.

ArcGIS Viewer for Silverlight

Released in the first quarter of 2012, the ArcGIS Viewer for Silverlight is another ready-to-deploy RIA option for Windows operating systems. It is built on the ArcGIS API for Silverlight and requires the Microsoft Silverlight browser plug-in. The ArcGIS Viewer for Silverlight provides an intuitive browser-based application builder with an interactive "what you see is what you get" (WYSIWYG) user experience. This option makes the process of creating new web mapping applications that are hosted on your own web servers very easy and, again, is more comprehensive than the ArcGIS Online application templates.

 ArcGIS Online application templatesArcGIS Viewer for FlexArcGIS Viewer for Silverlight
Technology based onJavaScriptFlexSilverlight
Web browser plug-in requiredNoAdobe Flash PlayerMicrosoft Silverlight
Installation locationCan be hosted on ArcGIS.com or on premises on your own web serverOn premises on your own web serverOn premises on your own web server
Supports ArcGIS.com login authenticationYesYesYes
Works with ArcGIS Online web mapsYesYesYes
Works with ArcGIS for Server and ArcGIS Online web servicesYesYesYes
Application builder GUI user experienceNoYesYes
Configuration optionsVaries between different templatesMany configuration optionsMany configuration options
Extensible framework for developersYes, with JavaScript API, if the template is downloaded to a local machineYes, with Flex API (viewer source code available)Yes, with Silverlight API (extensibility kit available)
Table 1: Comparison of configurable web client viewer options

 

The ArcGIS Viewer for Silverlight setup installs the application in your machine's web server resources directory (e.g., IIS). Its application builder runs in a web browser. When you start it the first time, the application builder will display some introductory text. Just click the Create New Application button to start creating a web application.

Deciding on data content for the new web application is the first step. You can create a new map with data you specify or use a web map from ArcGIS Online including your own ArcGIS.com items and content in groups that you belong to on ArcGIS.com.

After choosing the data content option, the application builder's main user interface appears, which includes three control tabs, Map, Tools, and Layout, located at the top above the main preview window. In the lower right-hand corner is an interactive Getting Started panel. This panel guides beginning users. Clicking an option in the Getting Started panel activates the corresponding application builder functionality on the control tabs.

On the Map tab, you can specify data content such as basemaps, operational layers, and GeoRSS feeds. You can also set the data layer symbolization properties and configure how attribute tables and pop-up dialogs appear. On the Tools tab, you define functionality, such as editing, geoprocessing, layer filters, printing, and selection tools, that will be available in the new web application. On the Layout tab, you can configure the application's look and feel by applying a custom logo, custom title, and colors and select from the prebuilt layout templates furnished. Any property changes will immediately be displayed in the main preview window.

A deployed ArcGIS Viewer for Silverlight application

A deployed ArcGIS Viewer for Silverlight application

The ArcGIS Viewer for Silverlight workflow is also nonlinear, so you can configure web application properties in any order. Finish creating the new web mapping application by clicking the Deploy button, which creates the supporting files for the new web application in the web server resources directory.

The ArcGIS Viewer for Silverlight application builder can also be used to manage the web mapping applications it has deployed. With the extensibility kit, Silverlight API developers can create add-ins to extend viewer capabilities. To learn more about the ArcGIS Viewer for Silverlight, see links.esri.com/silverlightviewer.

Conclusion

Esri offers three configurable web client viewer options that benefit nondevelopers, novice website creators, and developers. The ArcGIS Online application templates are the easiest. The viewers for Flex and Silverlight offer more configuration options and include application builders. All are client applications to ArcGIS for Server and ArcGIS Online web services and work with web maps from ArcGIS Online.

Three ArcGIS Viewer for Flex Download Options

You can get the ArcGIS Viewer for Flex as a compiled web client application that can be used immediately, or as an application builder used to create new web applications, or as uncompiled source code from GitHub that can be extended by Flex API developers.

Contact Us | Privacy | Legal | Site Map