Grid maps: where charts meet maps for easy data comparison
Explore small multiples like never before and discover a better way to compare regional data
Traditional maps are great for showing geographic data points for states, countries, or regions using shading or symbols. But what if you want to show richer data for each place, such as trends over time, or a breakdown by category?
That’s where a grid map – also known as a tile grid – comes in. Each region is represented by an equal-sized block, just like on a cartogram map, but the block contains a full chart, which could be anything from an area chart to a Sankey diagram. Traditionally these advanced visualizations were complex to make, but it’s now easy to build interactive responsive grid maps in Flourish!
Here’s an example showing how US states have voted since 1980. Each state is represented by an equal-sized square, making it easier to compare voting patterns in each state. This helps viewers spot trends over time – like shifts in political affiliation or the rise of swing states over time – plus regional trends, such as the dominance of Republicans in the southern states.
Why use a grid map?
Grid maps are excellent for comparing data across regions, especially when they vary in size or importance. Unlike regular maps, which make larger areas seem more significant, grid maps give equal space to every region, making it easier to compare data and spot trends, such as election results, or shifts in population across states or countries. In a nutshell, they are:
- Easy to understand: They are less cluttered, so it’s easier to compare information across regions or categories.
- Minimize bias: Grid maps remove the visual bias that larger areas might otherwise create in traditional maps.
- Fair comparison: Each region is the same size, so the data— rather than its size or importance — stands out.
- Highly customizable: You can add colors, labels, and other details to help your visualization tell a clear and compelling story.
How to create your own in Flourish
Ready to give it a go? To get started with your custom grid, start by setting up your chart as usual. Next, under the Grid of charts settings, switch to Fixed mode and enable Add custom position. This allows you to assign X and Y coordinates for each chart in the grid.
The first number sets the row, while the second number indicates the position within that row. Taking the example above, Finland would be positioned at (1,7), while Ireland would be positioned at (2,1).
It’s a good idea to turn off any axes to reduce clutter and complexity. And consider how you want the grid to behave on mobile – you can either scale it down, or choose to have it fall back to a different layout to keep things visible.
This new mode adapts beautifully to different screen sizes and works with multiple templates, including Line, Bar, Pie, Sankey, Slope charts, and Radars. For more details, check out our our help doc.
