A Choropleth Map is a map composed of colored polygons. It is used to represent spatial variations of a quantity.

  • A Choropleth map is a map that is made up of coloured polygons and is used to show the spatial variations of a quantity.

  • Scatterplot maps are scatterplots that have latitude and longitude instead of x and y axes.

  • There are different map projections.

  • Maps can be animated using a sequential value such as year.

  • Mapbox provides a rich interface with different themes, layers and zoom levels.

Plotly Express choropleth map function

px.choropleth(gapminder, locations = 'iso_alpha', color = 'pop')

  • select a column for locations. If mapping countries, the three-letter ISO format can be used for the location argument. If using country names you also need to set the locationmode to the column containing the country names.

px.choropleth(gapminder, locationmode = 'country names', locations = 'country', color = 'pop')

  • select a column containing data to be displayed using color. The data can be discrete or continuous variables

  • Animation frames can be used to show how values change over years by setting the animation_frame argument. animation_frame='year'

 px.choropleth(gapminder, locationmode = 'country names', locations = 'country',\
              color = 'lifeExp', animation_frame ='year')

Setting geographical attributes using layout.sub.geo attributes

  • The layout attribute has a geo subattribute where you can set various geographic attributes.

Using the dir method on a figure object will show the available methods. dir(fig.layout.geo) Here are some of them: (excluding __ methods):

‘bgcolor’, ‘center’, ‘coastlinecolor’, ‘coastlinewidth’, ‘countrycolor’, ‘countrywidth’, ‘domain’, ‘figure’, ‘fitbounds’, ‘framecolor’, ‘framewidth’, ‘lakecolor’, ‘landcolor’, ‘lataxis’, ‘lonaxis’, ‘oceancolor’, ‘on_change’, ‘parent’, ‘plotly_name’, ‘pop’, ‘projection’, ‘resolution’, ‘rivercolor’, ‘riverwidth’, ‘scope’, ‘showcoastlines’, ‘showcountries’, ‘showframe’, ‘showlakes’, ‘showland’, ‘showocean’, ‘showrivers’, ‘showsubunits’, ‘subunitcolor’, ‘subunitwidth’, ‘to_plotly_json’, ‘uirevision’, ‘update’, ‘visible’

fig.layout.geo.bgcolor='yellow' # to set the background colour / oceans
fig.layout.geo.framecolor='blue' # to set the frame colour
fig.layout.geo.showframe=False # to remove the rectangular frame 
fig.layout.geo.showcountries = True # show country borders for which there is no data
fig.layout.geo.landcolor = 'white' # This sets the colour for countries which have no data 

fig.layout.geo.countrycolor = '' # to set colours of country borders
fig.layout.geo.coastlinecolor = '' # colour of coastlines
fig.layout.geo.projection.type = 'natural earth' # to set a different map projection
fig.layout.geo.lataxis.range = [-54, 8] # to limit the vertical range of the axis to focus in on some countries
fig.layout.geo.lonaxis.range = [-20, 20] #limit the horizontal range of the axis

Sometimes the variable that the colour is mapped to might have a long name or a name you might want to edit on the map.

  • fig.layout.coloraxis.colorbar.title = ''

The default scope of a choropleth map is the ‘world’ but you can set the scope to a continent using one of 'world', 'usa', 'europe', 'asia', 'africa', 'north america', or 'south america'. The Default is 'world' unless projection is set to 'albers usa', which forces 'usa'.

Latitude and Longitude

You can use the fig.layout.geo.lataxis.range (to limit the vertical range of the graph) and fig.layout.geo.lonaxis.range (to limit the horizontal range of the graph) to focus more on particular countries.

Longitude is the measurement east or west of the prime meridian. Longitude is measured by imaginary lines that run around the Earth vertically (up and down) and meet at the North and South Poles. These lines are known as meridians. Each meridian measures one arcdegree of longitude. The distance around the Earth measures 360 degrees. See The National Geographic article.

  • Latitude runs 0-90 degrees north and south (the lines across)
  • Longitude runs 0-180 degrees east and west The Equator is the line across at 0 degrees. The prime meridian is the line down at 0 degrees.

You can set the scope parameter to a continent (a lowercase string such as ‘europe’ or ‘asia’ )if you want to focus in on a particular continent instead of the default 'world'.

You could also use the fig.layout.geo.lataxis.range and fig.layout.geo.lonaxis.range to focus in on smaller vertical and horizontal ranges.

The tip of South America is between 45 and 60 degrees South. Ireland’s latitude is approximately between 45 and 60 degrees North while it’s longitude is between approximately 15 degrees West and 0 (the Prime Meridian). Germany’s longitude is between 0 and 15 degrees East.

To focus in on a smaller vertical range, set the latitude range using a minus for South. To focus in on a smaller horizontal range, set the longitude range using a minus for West.

# from 15 degrees South to 60 North
fig.layout.geo.lataxis.range = [-15, 60]
# from 30 degrees west to 30 degrees East    
fig.layout.geo.lonaxis.range = [-30, 30]

At the Equator, the vertical meridians are as far away from each other as posible but at the North and South poles the vertical meridians are as close to each other as possible. This gives a more rectangular shape as you approach the equator because a unit of longitude is nearly the same as a unit of latitude. The proportions are completely different though as you approach the poles. The rectangles there begin to approximate triangles.

Map projections

When the earth is drawn on a flat rectangle the shape will appear somewhat distorted. There are different map projections that can be used. While none are perfect, you can decide on the tradeoff between accuracy in the shape, area, relative position etc.

Plotly Express has a projection parameter in it’s map functions that takes a string.

Here are the options from the docs (px.choropleth?):

One of 'equirectangular', 'mercator', 'orthographic', 'natural earth', 'kavrayskiy7', 'miller', 'robinson', 'eckert4', 'azimuthal equal area', 'azimuthal equidistant', 'conic equal area', 'conic conformal', 'conic equidistant', 'gnomonic', 'stereographic', 'mollweide', 'hammer', 'transverse mercator', 'albers usa', 'winkel tripel', 'aitoff', or 'sinusoidal'Default depends on scope.

You could instead set the map projection by setting a value using the layout.geo.project.type subattribute.

Callback functions with maps

Can create a callback that links a dropdown or other selection component with a map chart.

Tech used:
  • Python
  • HTML