Visualize administrative regions by defined zoom levels

Beginner difficulty banner

Context

In this tutorial, we're going to build a dynamic map dashboard that reveals the administrative layers of the United States, ranging from state-level down to zip codes. Ever curious about how to display different administrative regions at specific zoom levels? We're about to delve into that. Our journey will start by setting up a map in Builder that responds to zoom, transitioning smoothly from states to counties, and finally to zip codes, allowing users to access detailed statistics pertinent to each administrative area.

Using CARTO Builder, we'll craft a dashboard that not only informs but also engages users in exploring their regions of interest. Whether it's understanding demographic trends or pinpointing service locations, this guide will equip you with the knowledge to create an interactive map dashboard tailored to varying levels of administrative detail. Ready to unlock new levels of geographical insights? Let's dive in!

Steps To Reproduce

  1. Access the Maps section from your CARTO Workspace using the Navigation menu and create a new Map using the button at the top right of the page. This will open the Builder in a new tab.

  1. Now let's add USA States source to our Builder map. To add a source as a SQL query, follow the steps below:

    • Select the Add source from button at the bottom left on the page.

    • Select Custom Query (SQL) and then Type your own query under the CARTO Data Warehouse connection.

    • Click on the Add Source button.

The SQL Editor panel will be opened.

To add USA States, run the query below:

SELECT * FROM carto-demo-data.demo_tables.usa_states_boundaries
  1. A map layer is automatically added from your SQL Query source. Rename it to 'USA States'.

Now let's add the remaining sources following Step 2 to add USA Counties, USA Zip Codes and USA Census Tracks.

  1. Add USA Counties as a SQL query source using the below query. Once the layer is added, rename it to 'USA Counties'.

SELECT * FROM carto-demo-data.demo_tables.usa_counties
  1. Add USA Zip Codes as a SQL query source using the below query. Once the layer is added, rename it to 'USA Zip Codes'.

SELECT * FROM carto-demo-data.demo_tables.usa_zip_codes
  1. Finally, let's add USA Census Tracks as a SQL query source using the below query. Once the layer is added, rename it to 'USA Census Tracts'.

SELECT * FROM carto-demo-data.demo_tables.usa_census_tracts
  1. Next in our tutorial, after adding the administrative layers of the USA to our map, we'll set specific zoom level ranges for each layer. This step will optimize our map's clarity and usability, allowing users to see States, Counties, Zip Codes, and Census Tracts at the most appropriate zoom levels. Set the zoom level visibility in the Layer panel as follows:

    • USA States: 0 - 3

    • USA Counties: 4 - 8

    • USA Zip Codes: 9 - 11

    • USA Census Tracts: 12 - 21

With the zoom level visualization configured for each layer, our next step is to customize the dashboard for enhanced user insights. Our focus will be on understanding the population distribution across each administrative region of the USA.

  1. To achieve this, we will style our layers – USA States, Counties, Zip Codes, and Census Tracts – based on the 'Total_Pop' variable. This approach ensures users can easily grasp the spatial population distribution as they navigate and zoom in on the map. Let's set up the Fill Color for all four layers to effectively represent population data as follows:

    • Color based on: Total_Pop

    • Palette Steps: 4

    • Palette Name: ColorBrewer BuGn 4

    • Data Classification Method: Quantile

  1. Now let's set the Stroke Color to Hex Code #344c3a for all four layers.

  1. Set the map title to 'USA Population Distribution'.

  1. Now, let's add some Widgets to provide users with insights form the data. First, let's add a Formula Widget linked to USA Census Tracts source with the following configuration:

    • Operation method: SUM

    • Variable: Total_Pop

    • Formatting: 12.3k

    • Markdown note: Total population (2014) by Viewport for Census Tracts layer

You can check how the widget is updated as you move to the map. You can also make use of our Feature Selection Tool to select a custom area to gather the population that intersects with that specific area.

  1. We will add a second Formula Widget linked to USA Census Tracts source with the following configuration, to display the unemployment rate:

    • Operation method: AVG

    • Variable: Unemp_rate

    • Formatting: 12.35%

    • Markdown note: Unemployment rate (2014) by Viewport for Census Tracts layer

  1. The last widget we will add to our dashboard will be a Category widget linked to USA States layer. It will be a global widget, displaying the total population by state to provide users with stats but it won't interact with the viewport extent and the cross-filtering capability will be disabled. To configure this widget, follow the below steps:

    • Operation method: SUM

    • Source variable: name

    • Aggregation column: Total_Pop

    • Markdown note: Total population by state (2014) for States layer. Please note this widget does not interact with the viewport extent and cannot be filtered.

    • Behaviour mode: Global

    • Cross-filtering: Disabled

  1. Enable Interactions for the relevant layers. To do so, activate Interaction feature for each layer and add the desired attributions. On this occasion, we will select interaction Click mode using Light type and add just the relevant information with the renamed label. Repeat this process for the rest of the layers.

  1. In the Legend tab, under 'More legend options', set the legend to open when loading the map.

  1. Before publishing our map, let's add a map description so users can have more information about it while reviewing the map for the first time.

### Exploring USA's Administrative Layers

![Image: Global Populated Places](https://app-gallery.cartocdn.com/builder/usa_adminregions.jpg)

This interactive dashboard in Builder offers a journey through the administrative divisions of the United States, from states to census tracts. The map dynamically adjusts its focus as you zoom in, revealing finer details such as employment, population, etc. at each level.

___

#### Key Features of the Dashboard

- **Zoom-Dependent Visibility**: Each administrative layer is configured to appear within specific zoom ranges, ensuring a clear and informative view at every scale.

- **Insightful Widgets**: The dashboard includes formula widgets for total population and unemployment rates, linked to census tracts. A category widget, linked to the state layer, offers a broader overview of population by state, independent of the map's viewport.

- **Interactions**: Engage with the map through interactive layers, allowing you to click on regions for detailed information.
  1. We can make the map public and share it online with our colleagues. For more details, see Publishing and sharing maps.

  1. The final map should look something similar to the below:

Last updated