Reference map

Reference Map


In the reference map pattern, a small map is generally placed next to the other layout components. The map serves as an additional or auxiliary view and is mainly used for contextual purposes.


Geography is important for understanding everyday things. How is an object spatially related to another object or landmarks such as roads or highways? Seeing this location information is important for making rapid decisions, and, as we all know, a picture is worth a thousand words. In most cases, users don’t want a fancy map with a lot of tools. All that is needed is a small map that highlights the object in context with its geographic location. Full map or partial map layouts are simply too much.


Use when the map adds benefit to the understanding of information shown elsewhere or provides geographic context. Good examples of the reference map layout are dashboards that contain various data visualizations such as KPIs, lists, tables, charts, and descriptive text. The map then becomes another visualization component that adds value to the data orchestration and is a key element for decision-making. The map itself becomes secondary and less dynamic in nature.


The purpose of the map in a reference map layout is to display relevant content auxiliary to other information. This map is usually lightweight with limited interactions and a low level of user control, so it’s easy to embed the map in a page, widget, or even an info pop-up. It’s not necessary to provide the ability to change the appearance of a reference map. Because interactions are usually rare, it’s okay to forgo map tools and fancy interaction; ToolTips and hover effects are as far as you should go. Let the content of the page drive the map extent if possible.

Consider adding simple and effective cartographic representation with few distractions. Match the cartography with the branding, style, and color of the rest of the app.


Airborne Snow Observatories Inc. (ASO) provides basin-scale inventories of mountain snow water equivalent and snowmelt runoff forecasts with unique remote sensing and physical modeling. Its snow water resource monitoring and management app allows users to download and analyze the modeled data to support their critical water management tasks. The app follows the reference map layout on the landing page. The small map shows available basins. Users can click on a basin that opens an info pop-up from which they can select to open a panel to download the data or enter the dashboard of the basin.

Airborne Snow Observatories snow water resource monitoring and management app offers a reference map on its landing page.
Airborne Snow Observatories snow water resource monitoring and management app offers a reference map on its landing page.


Reference Map
Find your Representative provides a Reference Map to show party affiliation by state, clicking a state on the map is an alternative way of input, the cartography is adjusted to fit the color scheme of the app
Reference Map
Reference Map on mobile
Reference Map
Audubon uses a reference map to show the migration zones of a bird

3 thoughts on “Reference map

Leave a Reply