A Perspective on Entrepreneurship, Technology & Locative Dynamics

Integrating a nice-looking map in your web application is a painless task with the help of powerful APIs like the Google Maps API. Within minutes you can present your geospatial information on an interactive web map and everything should be fine but let’s dig a little bit deeper in this issue to find the best practices and to avoid some obvious mistakes.

I created a set on Flickr with over 50 screenshots of web maps to provide a quick overview of ways to integrate them in your application.

If you have to handle spatial data, first, you should ask yourself the following questions (Source: M. Hockenburry).

• Who is the user?
• What is the task?
• What technologies are appropriate and why?
• What is the role of spatial information and location?
• How do we represent that information and why is that representation effective?

There is no universal solution to present spatial information and the goal is to find the best suited for your application’s needs. Let’s do a classification to distinguish the different integration methods.

Static vs. Interactive

A static map does not provide any kind of interactivity (e.g. moving around, clickable interface or mouse wheel support). By clicking on a static map, a full-screen interactive map can be presented for advanced features.

Content

Is a plain map view without additional information sufficient? Does it makes sense to use a single marker or multiple markers to show data on top of the base map?

Distribution

If multiple data items are shown, how is their distribution? Is it even or are there hot spots with many items on the same place and thus a clustering is required? E. g., maps can get messy and unusable if dozens of geotagged photos refer to the same place.

Screen size (full screen vs. partial)

A map can be shown in a full screen mode or as a small additional page element in a sidebar or within the main content area.

Fixed width / flexible width

Is the map resizable and adaptive regarding different browser screen sizes?

Content overlay

Is content presented dynamically as an overlay on top of the map or in an area next to it?

Controls

Is it necessary to provide controls for different layers or zoom options? For example, offering a satellite, a hybrid, a street and a terrain view.

Consistency

Do all the maps behave in the same way? For example, zooming can be done with the mouse wheel on every map.

Technology

What kind of technology is used? A static image, a JavaScript-powered map or a Flash map?

In my opinion it is often the best way to show a static fixed-width map in a sidebar that can be used as an entrance point for a bigger (full screen) map that is interactive, provides many controls and eventually content overlays. A static image of a map is good to quickly highlight the geospatial nature of the information while a large map can deliver the full power of web mapping, enabling to aggregate, search and filter geo data.

If you want to learn more about spatial applications, check out the excellent course notes “Design of Spatial Applications” provided by Mathew Hockenberry of the MIT Media Laboratory. He makes aware of the fact, that it is not always the best idea to present geospatial information on a map. Often it is clearer for a user and better to understand if a textual representation is used.

| View | Upload your own