by , Location Technology Solutions, No Comments

Oct 7

Open Source Flex GIS Solutions

by web maps, Location Technology Solutions, Comments Off on Open Source Flex GIS Solutions

Oct 7

There remain few Flex GIS (Geographic Information System) API’s outside of that offered by ESRI for ArcGIS.
Though an excellent API, its requires that clients have a purchased license(s) for ArcGIS. Depending on the number of licenses, this can be very costly. ArcGIS also is not fully compliant with the OGC (Open Geospatial Consortium) standards. We will discuss advantages of full OGC compliance in due course. The discussion below resulted in the building of a very flexible Flex GIS application. A demo is available here.

WebMapSolutions Flex OpenScales GIS Solution

At WebMapSolutions we have been frustrated by the lack of good GIS Flex options. Working closely with one of our clients, we have been building a very flexible GIS application using OpenScales. I have mentioned OpenScales in a number of previous posts. I’ve written about some of the frustration of working with the API. Tight coupling being the biggest issue. That is computer speak for interdependency between components.

Flex Openscales Map Demo

Figure 1 – Flex Openscales Map Demo

We decided to take a step back. To download the 1.1.7 build of OpenScales, avoid using existing client code and started building a Flex GIS template using this API from scratch. Our goals were four fold:

1. To use an Model View Controller (MVC) as the base pattern for the template. This helps organise and gives structure to the application. So programmers find it easier to work with and extend.

2. Decouple the components and thus allow for a modular design. Whereby new components or tools can be added and/or combined with those already existing.

3. Use the power of WMS (Web Map Service) to style layers and WFS (Web Feature Service) for both query and search capabilities.

4. Give clients maximum editing and styling flexibility. Thus controlling users access to tools (print, search, identify etc), which layers or endpoints to load, titles, logos and the styling of all components. We planned to allow all these to be changed by clients without the need to recompile the application.

With our best foot forward we marched into the semi-unknown.

We made some initial design decisions. First we would build the application to interface with any fully OGC compliant server. In the demo we are using the excellent and open source GeoServer. Second we would use tiled basemaps from Yahoo. Two in particular; satellite imagery and streets. We used code open sourced from previous work and actually adapted from Modest Maps to achieve this. Third, layer overlays would use WMS. This allows for the powerful styling capabilities of WMS. Note, WMS simply provides an image. Thus in the demo, the coloured states overlay is simply an image provided by a WMS call to GeoServer. Fourth, WFS layers would only be used for identify and search capabilities.WFS provides the raw information about a feature. Thus attributes and geometry. Flex draws features on the screen and allows interaction. So no need to call back to the server. The data is there and ready to be interrogated. This should result in considerably improved performance. We also only allow one WFS layer to be turned on at any one time. Should another tool which requires a map click be opened, any visible WFS layer is turned off. This avoids conflict between map clicks.

Map Interaction

In a previous blog post, I discuss the principals behind the map interaction of the demo. The goal is to make only one tool available at any one time, and to not litter the screen with pop ups. Thus open pop ups are minimised when another is opened, functionality is temporarily suspended. The minimised pop ups are grouped together to the bottom right of the screen.

Flex Openscales Map Demo minimised pop ups

Figure 2 – Flex Openscales Map Demo – Minimised Pop Ups

Basemaps and Layers

Basemaps and WMS layers are listed, and can be altered, in the layers pop up. As Figure 3 below shows, satellite and map (streets) basemaps are available. The WMS layers are listed lower down. Their transparency can be altered by a slider. A legend of the WMS layers is also included.

Flex Openscales Map Demo Layers Pop Up

Figure 3 – Flex Openscales Map Demo – Layers Pop Up


The header bar is easy to customise by clients. So the text in the header and subheader, logo and colour can be changed via a configuration file. It is also easy to change the header bar to fit specific client requirements.

Flex Openscales Map Demo Header

Figure 4 – Flex Openscales Map Demo – Header

The available tools are listed in the right side of the header bar. Currently available are full extent, layers, print, help, address locator, identify/search and draw.

Not only does this tool print in portrait and landscape orientation, it generates a PDF and allows users to preview before printing.

Flex Openscales Map Print Tool

Figure 5 – Flex Openscales Map Demo – Print Tool

Address Locator
The address locator tool allows city searches and centres the map at that location.

Flex Openscales Map Address Locator Tool

Figure 6 – Flex Openscales Map Demo – Address Locator Tool

The draw tool allows users to annotate the map. Thus adding and editing points and lines on the map.

Flex Openscales Map Draw Tool

Figure 7 – Flex Openscales Map Demo – Draw Tool

Identify and Search
The identify tool allows users to turn on a selected WFS layer from a drop down list. In the demo click on a state and the identify pop up is populated with the attributes of the selected state.

Flex Openscales Map Identify Tool

Figure 8 – Flex Openscales Map Demo – Identify Tool

The search tool searches within all attributes. In the demo the search is against unemployment. States are highlighted with a number greater than that entered by the user. No server call is made with this tool. Notice how fast the tool performs.

Flex Openscales Map Search Tool

Figure 9 – Flex Openscales Map Demo – Search Tool

Client Editing and Styling

We are using two files to style and configure the application. The first, shown in Figure 11 below, is a style sheet.

Flex Openscales Map Style

Figure 10 – Flex Openscales Map Demo Style

The second, shown in Figure 12 below, is config.xml.

Flex Openscales Map Config

Figure 11 – Flex Openscales Map Demo Config

Both are easily edited by clients, and allow the application to be customised to clients satisfaction.


OpenScales provides one of the few API’s which allow developers to build Flex GIS applications. The template described above builds on this solid base and removes some of the current weaknesses of OpenScales. It will appeal to clients who:

  1. Would like to avoid the potential expense of ESRI ArcGIS
  2. Are looking to upgrade from ESRI ArcIMS but lack the budget
  3. Recognise the benefits full OGC compliance brings to GIS web application development
  4. Have in place already GeoServer or Mapserver
  5. Would like a Flex alternative to OpenLayers
  6. Are frustrated by the inability to change current GIS Web applications style and configuration without the need of a programmer
  7. Find their current Web GIS application performing slowly

You can get the application source here. Contact us at for any questions.

Related Resources

    Comments are closed.