Chart Marker

Chart Marker

What Problem Does This Solve?

Clustering is limited to counts of features without the ability to visualize a second dimension within the data

Why Use This Pattern?

A common technique to avoid showing too many points on the map is clustering them into bubbles with numbers inside. This mechanism is effective to illustrate the amount of observations across different geographies, but it lacks communicating additional aspects of the data. This is important when understanding the type of “cluster” is relevant to the user, e.g. seeing that an area has lots of schools is good to know but that doesn’t tell me if those schools are public or private.

When to Use This Pattern

Use to add insights to the map by visualizing proportions of a discrete attribute of the data in addition to the counts in that area. Examples for observations, i.e. point data, are death casualties and their cause or population by race.

Another use of chart markers is adding a second value to data. This allows for displaying multiple topics at the same time instead of mapping a single attribute alone. An example may be to show the maximum occupancy of a hotel as a number in the center and the current utilization as a donut around, e.g. the hotel has 100 beds and is 90% booked.

What’s the Solution?

Add small charts to the map that visually look like markers. Charts can be either of type pie or donut. Additionally, one can add a number to the center of the donut to show the total amount mapped to the chart. In the case of cluster maps the charts will update as the user pans or zooms the map according to the cluster algorithm in use, i.e. as the user zooms in the amounts decrease until eventually the map shows the raw point data.

Add hover effects to show additional information for each slice of the pie. Click/press events can be used to invoke a popup showing additional details like the breakdown of the individual features.

As with choropleth maps, showing a legend is key to understanding the meaning of the chart.

Special Considerations

If the charts show data that belongs to a fixed geometry like a zip code or buildings, then consider using scale dependency to disable the chart markers at certain scales to avoid overlap.

Follow general best practices for pie/donut charts like starting the slices at “12 o’clock” and using few categories and good color palettes.

Examples

Deaths in Italian Prisons
Deaths in Italian Prisons
Hispanic Population as percentages of the total population
Hispanic Population as percentages of the total population
Example of a Chart Marker
Example of a Chart Marker
Chart Marker
Chart Marker
Chart Marker
Chart Marker
Chart Marker
Chart Marker

Leave a Reply