Chameleon Web Mapping Framework

July 16, 2005

Sharing is Caring

This article introduces you to Chameleon, a tool that makes it a lot easier for the non-programmer to build Web mapping applications using MapServer.Chameleon is just one tool you could use.I'll introduce some others at the end of the article.

First some definitions, and basics about how Chameleon fits into the application development process.MapServer is a Web mapping development platform originally developed by the University of Minnesota.It is often referred to as the "UMN MapServer project." An international team develops this software using an open source approach, making it free to use, customise and distribute.MapServer comes as a CGI executable application that can be used with a Web server.

MapServer also comes with an API called MapScript, giving programmers the option of writing custom mapping functionality that the CGI version does not support.MapScript makes it possible to incorporate mapping functionality into custom programs using several different languages.But, many developers of Web mapping applications are not programmers, and are unable to tap into the power of MapScript.To build sophisticated MapServer Web mapping applications, you need several sets of skills, including:
  • Web server management
  • Mapping server management (e.g.MapServer map file creation)
  • Graphical interface design/layout (HTML)
  • Interaction programming (e.g.PHP, Javascript)
  • Acquiring and preparing data.
Enter Chameleon.Chameleon is an open source product built on top of MapScript using the PHP programming language.It provides simplified access to many features only accessible in MapScript, by providing pre-made scripts as re-usable components.Chameleon makes it possible for non-programmers to insert sophisticated mapping components into Web mapping applications.

Introducing Chameleon
Chameleon is an excellent framework for building web mapping sites.It can use MapServer behind the scenes or pull data together using the Open Geospatial Consortium (OGC) specifications for web map servers (WMS).Figure 1 shows a typical configuration.

Figure 1.A typical configuration of a Chameleon application using MapServer (Courtesy DM Solutions Group)

DM Solutions Group (Ottawa, Canada) developed a set of re-usable components for clients in the Government of Canada.The result is the large set of components that make up the Chameleon framework.They needed a way to integrate web map servers and make them accessible through easy-to-use web interfaces.Now, MapServer-like functionality can be added to any Web application.

Using Chameleon Functionality
Chameleon is a set of over 300 PHP scripts that provide access to mapping-related "widgets" and functions.You don't need to know how these scripts work to use them.They are built using PHP MapScript behind-the-scenes, but allow you to simply deal with HTML tags.For example, by using Chameleon HTML tags, a designer can add a map, scalebar, legend, query tools, printing tools and much more to an application.

Application developers use Chameleon by adding the tags to HTML template pages.They are called CWC2 tags, short for "Configurable Web Mapping Client Components." Using these tags provides a simplified method for adding mapping content to a web application.Figure 2 shows an example of some of the behind the scenes code contained in a widget.

Figure 2.Screenshot of some code contained in a widget.(Click for larger image)

Here is how a few of the tags look when put into an HTML file (click any of the code snippets for larger view):

Main map image:
Legend with layer visibility controls:

Each tag includes parameters for customising the function of the widget.There are over 100 widgets available, mostly aimed at providing options and tools to the user.Some other widgets are:
  • ExpressionBuilder - for building data filters
  • CatalogSearch - for searching OGC catalog services
  • MapSize - for changing the size of the map on-the-fly
  • ProjectionSelector - for changing the map projection
  • PrintProduction - for producing print-friendly graphic files

Requirements for Installation
Chameleon can be easily installed on most platforms, especially if a binary MapServer installer/package is used.

MapServer for Windows (MS4W) has a Chameleon package that comes with sample applications.FOSS GIS Suite (FGS) is a Linux installer with many modules, including Chameleon.

Both of these install packages include a Web server and a fully functioning PHP environment with PHP MapScript ready to use.If you do not plan to use their built-in Web server, then you will need to configure your own aliases.

If you already have a MapServer installation running, with PHP MapScript ready to use, then the installation process is not too difficult.Simply download and extract one of the Chameleon code packages and configure some XML-based configuration files.

Working From Sample Applications
Chameleon comes with a handful of sample applications that are great for getting started.These examples show you how a typical Chameleon application is put together.There is usually a PHP file as the starting page, indicating several settings:
  1. Where the Chameleon system files are located
  2. What MapServer map file (or OGC map context Document) to use for drawing features and accessing data sources
  3. What template HTML file to use for laying out the page

Web designers can focus on the Web layout and application look and feel.Geospatial application developers can manage the map presentation and interaction components.Data custodians can focus on pre-processing data and making it available to the application.

Standard Look and Feel
Chameleon comes with a default "skin".This provides clear and attractive tool buttons which are laid out using cascaded style sheets (CSS).Web designers can create their own button images and page formatting, but for those who are not Web designers, a set of attractive tools is ready to use out-of-the-box.Figures 3 and 4 show screenshots of two Chameleon-based Websites.
Figure 3.Chameleon application developed by People GIS and DM Solutions (Click for larger image)

Figure 4.Chameleon application developed by MapItOut(Click for larger image)

Interactive Tools Ready to Go
Chameleon also provides the interactivity that you may be used to from desktop mapping applications, such as dragging zoom boxes or panning. You do not need to set up any Javascript or DHTML components because they are already integrated within Chameleon.Thankfully, Java-based components are no longer necessary for the interactive sites because Javascript and DHTML are readily supported by most modern web browsers. This makes Chameleon lightweight and standards-based.Here are what I view as the key benefits to Chameleon
  1. Re-usable components.As you develop or customise your own widgets and templates, they can be re-used in other Chameleon applications.
  2. Advanced features.The enhanced sample application is quite impressive.It includes Postal Code look-ups, interactive annotating and labelling, changing map size, printing, querying and more.
  3. Shortened development cycle.Understanding how to set up and use Chameleon allows you quickly create new sites, based on settings used in other ones.In many cases, the only changes needed are within a MapServer configuration file.
Chameleon has an active and growing support network.An interactive help viewer shows widget documentation, including syntax examples. Mailing list support is excellent, with direct assistance coming not only from DM Solutions but from other developers and users worldwide. Users and developers openly share custom widgets and templates to help new users.Commercial support is available from many of the companies who develop using Chameleon, as well as from DM Solutions.

Closing Thoughts
Not being an avid programmer, I had shied away from using any MapScript-based applications in the past.When Chameleon first came out, I wasn't sure how useful it would be for my needs.Now it is the MapServer framework I use most.Chameleon has encouraged me to dust off my programming skills, taking existing widgets or templates and making small changes, rather than starting from scratch.With a minimal amount of work I can quickly create a map file and make a professional looking, sophisticated web mapping site literally in minutes.

Other Options
Here we've focused on Chameleon.But there are other options, which are at varying stages of development.A few examples include:


Sharing is Caring

Geospatial Newsletters

Keep up to date with the latest geospatial trends!

Sign up

Search DM

Get Directions Magazine delivered to you
Please enter a valid email address
Please let us know that you're not a robot by using reCAPTCHA.
Sorry, there was a problem submitting your sign up request. Please try again or email

Thank You! We'll email you to verify your address.

In order to complete the subscription process, simply check your inbox and click on the link in the email we have just sent you. If it is not there, please check your junk mail folder.

Thank you!

It looks like you're already subscribed.

If you still experience difficulties subscribing to our newsletters, please contact us at