Subdividing USA states to create custom regions

Carlos Moreira on November 9, 2021

Subdividing USA states to create custom regions

If you need to create sub-regions of a state in the US map, one approach could be to create individual state maps, where you create groups of regions with counties and they overlay those maps in the main US map. The result could be something like the example below:

The result is not perfect, but it’s usable in most scenarios.

This is achieved by using the individual county codes in a single region entry, in the state map:

Subdividing USA states to create custom regions

In addition to creating groups, in the individual state map of the example below, we also set the borders to be 0px, so that the state borders are less visible. If you have the groups coloured the same way, you can set the border colour to be that same colour, instead of setting it to 0px. Another approach to improve the county borders issue could be to create individual maps for each group and this way you can set the border colour individually for those maps. In the example above you would end up having 3 maps in addition to the base map.

Other solutions to create custom regions, would include the creation of custom geojson files, which might not be so easy.

Group Hover Example with Custom Middle East Map

Carlos Moreira on January 15, 2020

In this example we explored the group feature together with the overlay maps option to achieve the map below. The requirements where that some countries would share the same hover state but keep individual tooltips.

The map above actually represents 3 different maps. The main map with the dark purple and then 2 maps for each group of countries in green. The 3 maps are displayed in the same using the overlay feature, available in the PRO version, where each of the overlaid maps has the ‘Group’ option enabled, so that they share the same hover effect. In this particular example we included individual tooltips for each country even in the grouped countries, by adding an individual entry for each country, instead of ‘grouping’ them in one entry.

The above map, with only these countries, doesn’t exist by default. We created a ‘custom map’ by using the ‘Regions to Display‘ option and specifying the regions we wanted from the included world map.

If you have any question on how to create a similar map feel free to contact us.

World Regions with Office locations

Carlos Moreira on October 29, 2019

In this example we are trying to create a map where we display the office locations with markers and give interactivity to a particular set of world regions. The regions are grouped and have the same interactivity when hovered and clicked.

It’s only possible to replicate the map below using the PRO version of the plugin because it uses the ‘Display Content to the Right‘ click action and the ‘Group‘ regions feature which are only available in PRO. Further below you’ll have an example on how to create a similar map using the FREE version.

Grouped Hover Effect

This map requires a bit of work to accomplish, but only because we want the group entries when hovering. If we didn’t require to set the hover effect in the different regions when hovering one of the groups, we would only require one map. But the above example displays what is possible to achieve with the plugin leveraging in the many features it provides.

We created 5 different maps:

  • Base Map displaying the World Regions map
  • Africa & Australia map
  • Americas map
  • Europe & Middle East
  • Asia map

In the base map we added the different markers, which don’t have any particular interactivity in this example, but they could have. Also – and this is the important detail – we choose in the ‘Overlay’ options the other 4 maps. This means that this ‘base map’ will also display the data from the other 4 maps.

For each of the other 4 maps, we only displayed the regions we wanted and enabled the ‘group’ option. This means all regions in this map will be a group and share the same hover state.

Normal World Regions Map

This approach is much more easier, because we don’t need to create all the different maps. The main difference with the above map is that the regions are not grouped and don’t share the hover effect. If you only use an action to open URLs, you can create this map using the FREE version of the plugin.

Feel free to leave a comment below or contact me for further details.