Skip to main content
This site and Lume package is currently under development and may not be stable.
Open Innovations
OI Lume Viz

Hex cartogram

Component: map.hex_cartogram

We love hex cartograms and this lets you make them.

  1. A basic hex cartogram
  2. Hex labels
  3. Hexes with the same colour
  4. Hexes with defined colours
  5. Hexes with defined colours - data and hexes separately
  6. Hexes with defined colours - external hexes
  7. Hexes with defined colours - external hexes and data
  8. Hexes coloured by a colour scale
  9. Add a legend
  10. Custom tooltips
  11. Filter hexes
  12. Add an interactive slider
  13. Big example

1. A basic hex cartogram§

Embeddable version

A very simple hex cartogram that just shows the hexes.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      q: -2
      r: -1
    E07000163:
      'n': Craven
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      q: 0
      r: 0
    E07000169:
      'n': Selby
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      q: 0
      r: -1
    E06000014:
      'n': York
      q: 0
      r: 1

2. Hex labels§

Embeddable version

A very simple hex cartogram with a label added to each hex. The label value allows you to construct a string. In this example the labels are created from each hex's n attribute and are limited to the first three characters.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      q: -2
      r: -1
    E07000163:
      'n': Craven
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      q: 0
      r: 0
    E07000169:
      'n': Selby
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      q: 0
      r: -1
    E06000014:
      'n': York
      q: 0
      r: 1
label: '{{ n | slice(0,3) }}'

3. Hexes with the same colour§

Embeddable version

A very simple hex cartogram where we define a custom colour named test and then use that for the value.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

colours:
  test: '#999000'
hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      q: -2
      r: -1
    E07000163:
      'n': Craven
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      q: 0
      r: 0
    E07000169:
      'n': Selby
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      q: 0
      r: -1
    E06000014:
      'n': York
      q: 0
      r: 1
value: test

4. Hexes with defined colours§

Embeddable version

A very simple hex cartogram. The colour of each hex is given by setting the value key to the colour property.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      colour: '#E6007C'
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      colour: '#FF6700'
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      colour: '#0DBC37'
      q: -2
      r: -1
    E07000163:
      'n': Craven
      colour: '#178CFF'
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      colour: '#2f529f'
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      colour: '#722EA5'
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      colour: '#F9BC26'
      q: 0
      r: 0
    E07000169:
      'n': Selby
      colour: '#1DD3A7'
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      colour: '#EF3AAB'
      q: 0
      r: -1
    E06000014:
      'n': York
      colour: '#F92626'
      q: 0
      r: 1
value: colour

5. Hexes with defined colours - data and hexes separately§

Embeddable version

This is the same as the previous example except we pass a data array which sets properties for each hex rather than set those in the HexJSON. We use matchKey to match the key in hexjson → hexes with the required key in a data array item. We also customise the label for each hex to be the first letter.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      q: -2
      r: -1
    E07000163:
      'n': Craven
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      q: 0
      r: 0
    E07000169:
      'n': Selby
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      q: 0
      r: -1
    E06000014:
      'n': York
      q: 0
      r: 1
data:
  - code: E08000016
    colour: '#E6007C'
  - code: E08000032
    colour: '#FF6700'
  - code: E08000033
    colour: '#0DBC37'
  - code: E07000163
    colour: '#178CFF'
  - code: E07000165
    colour: '#2f529f'
  - code: E08000034
    colour: '#722EA5'
  - code: E08000035
    colour: '#F9BC26'
  - code: E07000169
    colour: '#1DD3A7'
  - code: E08000036
    colour: '#EF3AAB'
  - code: E06000014
    colour: '#F92626'
matchKey: code
value: colour

6. Hexes with defined colours - external hexes§

Embeddable version

If you are using the same HexJSON layout in multiple places it makes sense not to have to repeat that layout every time. To help with this you can specify where the appropriate hexjson is.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson: hexjson.yorks
data:
  - code: E08000016
    colour: '#FF6700'
  - code: E08000032
    colour: '#F9BC26'
  - code: E08000033
    colour: '#F9BC26'
  - code: E07000163
    colour: '#1DD3A7'
  - code: E07000165
    colour: '#1DD3A7'
  - code: E08000034
    colour: '#F9BC26'
  - code: E08000035
    colour: '#F9BC26'
  - code: E07000169
    colour: '#1DD3A7'
  - code: E08000036
    colour: '#F9BC26'
  - code: E06000014
    colour: '#1DD3A7'
matchKey: code
value: colour

7. Hexes with defined colours - external hexes and data§

Embeddable version

Similarly, you can specify where the data are stored rather that explicitly include them in the YAML.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson: hexjson.yorks
data: test.data.hex_yorks
matchKey: code
value: colour

8. Hexes coloured by a colour scale§

Embeddable version

The same hex layout as above but this time we colour the hexes by a defined scale with an optional min and max. The colour scale is a comma separated string of colour stops each of the form rgb(r,g,b) x% in the style of a CSS linear gradient.

Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson: hexjson.yorks
data:
  - code: E08000016
    LAD21NM: Barnsley
    Aged 15 years and under: 44782
  - code: E08000032
    LAD21NM: Bradford
    Aged 15 years and under: 124837
  - code: E08000033
    LAD21NM: Calderdale
    Aged 15 years and under: 39997
  - code: E07000163
    LAD21NM: Craven
    Aged 15 years and under: 8643
  - code: E07000165
    LAD21NM: Harrogate
    Aged 15 years and under: 27362
  - code: E08000034
    LAD21NM: Kirklees
    Aged 15 years and under: 86941
  - code: E08000035
    LAD21NM: Leeds
    Aged 15 years and under: 153483
  - code: E07000169
    LAD21NM: Selby
    Aged 15 years and under: 16556
  - code: E08000036
    LAD21NM: Wakefield
    Aged 15 years and under: 65832
  - code: E06000014
    LAD21NM: York
    Aged 15 years and under: 30738
matchKey: code
value: Aged 15 years and under
scale: Viridis

9. Add a legend§

Embeddable version

The same hex layout as above but this time we colour the hexes by a defined scale with an optional min and max. The colour scale is a comma separated string of colour stops each of the form rgb(r,g,b) x% in the style of a CSS linear gradient. We also define a legend with 5 levels - three of the levels are given labels. We customise the tooltip label to make sure it includes a percentage sign.

160k
120k
80k
40k
0
Hexmap.BarnsleyBradfordCalderdaleCravenHarrogateKirkleesLeedsSelbyWakefieldYork

This example was made with config:

hexjson: hexjson.yorks
data:
  - code: E08000016
    LAD21NM: Barnsley
    colour: '#E6007C'
    Aged 15 years and under: 44782
  - code: E08000032
    LAD21NM: Bradford
    colour: '#FF6700'
    Aged 15 years and under: 124837
  - code: E08000033
    LAD21NM: Calderdale
    colour: '#0DBC37'
    Aged 15 years and under: 39997
  - code: E07000163
    LAD21NM: Craven
    colour: '#178CFF'
    Aged 15 years and under: 8643
  - code: E07000165
    LAD21NM: Harrogate
    colour: '#2f529f'
    Aged 15 years and under: 27362
  - code: E08000034
    LAD21NM: Kirklees
    colour: '#722EA5'
    Aged 15 years and under: 86941
  - code: E08000035
    LAD21NM: Leeds
    colour: '#F9BC26'
    Aged 15 years and under: 153483
  - code: E07000169
    LAD21NM: Selby
    colour: '#1DD3A7'
    Aged 15 years and under: 16556
  - code: E08000036
    LAD21NM: Wakefield
    colour: '#EF3AAB'
    Aged 15 years and under: 65832
  - code: E06000014
    LAD21NM: York
    colour: '#F92626'
    Aged 15 years and under: 30738
value: Aged 15 years and under
matchKey: code
scale: Viridis
min: 0
max: 160000
legend:
  position: top right
  items:
    - value: 160000
      label: 160k
    - value: 120000
      label: 120k
    - value: 80000
      label: 80k
    - value: 40000
      label: 40k
    - value: 0
      label: '0'

10. Custom tooltips§

Embeddable version

Colours are set in the HexJSON. We define a tooltip and use a matchKey to define the key in the data to match against a hex. The tooltip can contain replacement values of the form {{ key }}.

Hexmap.Barnsley
Aged 15 and under: 44,782Bradford
Aged 15 and under: 124,837Calderdale
Aged 15 and under: 39,997Craven
Aged 15 and under: 8,643Harrogate
Aged 15 and under: 27,362Kirklees
Aged 15 and under: 86,941Leeds
Aged 15 and under: 153,483Selby
Aged 15 and under: 16,556Wakefield
Aged 15 and under: 65,832York
Aged 15 and under: 30,738

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      colour: '#E6007C'
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      colour: '#FF6700'
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      colour: '#0DBC37'
      q: -2
      r: -1
    E07000163:
      'n': Craven
      colour: '#178CFF'
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      colour: '#2f529f'
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      colour: '#722EA5'
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      colour: '#F9BC26'
      q: 0
      r: 0
    E07000169:
      'n': Selby
      colour: '#1DD3A7'
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      colour: '#EF3AAB'
      q: 0
      r: -1
    E06000014:
      'n': York
      colour: '#F92626'
      q: 0
      r: 1
data:
  - code: E08000016
    LAD21NM: Barnsley
    Aged 15 years and under: 44782
  - code: E08000032
    LAD21NM: Bradford
    Aged 15 years and under: 124837
  - code: E08000033
    LAD21NM: Calderdale
    Aged 15 years and under: 39997
  - code: E07000163
    LAD21NM: Craven
    Aged 15 years and under: 8643
  - code: E07000165
    LAD21NM: Harrogate
    Aged 15 years and under: 27362
  - code: E08000034
    LAD21NM: Kirklees
    Aged 15 years and under: 86941
  - code: E08000035
    LAD21NM: Leeds
    Aged 15 years and under: 153483
  - code: E07000169
    LAD21NM: Selby
    Aged 15 years and under: 16556
  - code: E08000036
    LAD21NM: Wakefield
    Aged 15 years and under: 65832
  - code: E06000014
    LAD21NM: York
    Aged 15 years and under: 30738
value: colour
matchKey: code
tooltip: >-
  {{ LAD21NM }}<br />Aged 15 and under: {{ Aged 15 years and under |
  toLocaleString() }}

11. Filter hexes§

Embeddable version

Note that this feature is a progressive enhancement and will only function if Javascript is enabled.

We can add an interactive filter to our hex map. We can set tools → filter → label to the name of a column in the data - this defines the text used in the filter drop-down list. We can set the maximum number of results to show in the filter drop down using tools → filter → max.

Hexmap.Median Private Sector Rents
Barnsley (2021): £475Median Private Sector Rents
Bradford (2021): £525Median Private Sector Rents
Calderdale (2021): £500Median Private Sector Rents
Craven (2021): £580Median Private Sector Rents
Harrogate (2021): £750Median Private Sector Rents
Kirklees (2021): £525Median Private Sector Rents
Leeds (2021): £700Median Private Sector Rents
Selby (2021): £595Median Private Sector Rents
Wakefield (2021): £550Median Private Sector Rents
York (2021): £780
Data: West Yorkshire Combined Authority

This example was made with config:

hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      colour: '#E6007C'
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      colour: '#FF6700'
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      colour: '#0DBC37'
      q: -2
      r: -1
    E07000163:
      'n': Craven
      colour: '#178CFF'
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      colour: '#2f529f'
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      colour: '#722EA5'
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      colour: '#F9BC26'
      q: 0
      r: 0
    E07000169:
      'n': Selby
      colour: '#1DD3A7'
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      colour: '#EF3AAB'
      q: 0
      r: -1
    E06000014:
      'n': York
      colour: '#F92626'
      q: 0
      r: 1
data:
  - '2016': 433
    '2017': 450
    '2018': 520
    '2019': 450
    '2020': 475
    '2021': 475
    code: E08000016
    LAD21NM: Barnsley
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 500
    '2020': 500
    '2021': 525
    code: E08000032
    LAD21NM: Bradford
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 495
    '2020': 495
    '2021': 500
    code: E08000033
    LAD21NM: Calderdale
  - '2016': 550
    '2017': 560
    '2018': 550
    '2019': 575
    '2020': 575
    '2021': 580
    code: E07000163
    LAD21NM: Craven
  - '2016': 700
    '2017': 720
    '2018': 725
    '2019': 725
    '2020': 745
    '2021': 750
    code: E07000165
    LAD21NM: Harrogate
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 500
    '2020': 500
    '2021': 525
    code: E08000034
    LAD21NM: Kirklees
  - '2016': 600
    '2017': 650
    '2018': 671
    '2019': 675
    '2020': 725
    '2021': 700
    code: E08000035
    LAD21NM: Leeds
  - '2016': 550
    '2017': 550
    '2018': 550
    '2019': 570
    '2020': 595
    '2021': 595
    code: E07000169
    LAD21NM: Selby
  - '2016': 500
    '2017': 520
    '2018': 525
    '2019': 525
    '2020': 550
    '2021': 550
    code: E08000036
    LAD21NM: Wakefield
  - '2016': 700
    '2017': 745
    '2018': 795
    '2019': 775
    '2020': 750
    '2021': 780
    code: E06000014
    LAD21NM: York
columns:
  - name: filterLabel
    template: '{{ LAD21NM }} ({{ code }})'
value: 2021
scale: Viridis
matchKey: code
tools:
  filter:
    label: filterLabel
tooltip: >-
  Median Private Sector Rents<br />{{ LAD21NM }} (2021): <strong>&pound;{{ 2021
  | toLocaleString() }}</strong>
attribution: >
  Data: <a
  href="https://www.westyorks-ca.gov.uk/media/8790/lcr-housing-delivery-monitoring-report-2020-21-4.pdf">West
  Yorkshire Combined Authority</a>

12. Add an interactive slider§

Embeddable version

Note that this feature is a progressive enhancement and will only function if Javascript is enabled.

Sometimes you may have multi-epoch data. If you want the person viewing the page to be able to see these different epochs on the same cartogram, you can add an interactive slider. To define which columns to use we pass an ordered array to tools → slider → columns. In this example we have numeric data for the years 2016 to 2021 so we will set it to [2016,2017,2018,2019,2020,2021].

In the previous example we used 2021 in the tooltip to reference the column that the value was taken from. But now the active column depends on the slider position. We need to refer to the current value differently; use the special replacement {{ _value }} to access the active data column.

Hexmap.Median Private Sector Rents
Barnsley (2019): £450Median Private Sector Rents
Bradford (2019): £500Median Private Sector Rents
Calderdale (2019): £495Median Private Sector Rents
Craven (2019): £575Median Private Sector Rents
Harrogate (2019): £725Median Private Sector Rents
Kirklees (2019): £500Median Private Sector Rents
Leeds (2019): £675Median Private Sector Rents
Selby (2019): £570Median Private Sector Rents
Wakefield (2019): £525Median Private Sector Rents
York (2019): £775
Data: West Yorkshire Combined Authority

This example was made with config:

width: 500
hexjson:
  layout: odd-r
  hexes:
    E08000016:
      'n': Barnsley
      colour: '#E6007C'
      q: 0
      r: -2
    E08000032:
      'n': Bradford
      colour: '#FF6700'
      q: -1
      r: 0
    E08000033:
      'n': Calderdale
      colour: '#0DBC37'
      q: -2
      r: -1
    E07000163:
      'n': Craven
      colour: '#178CFF'
      q: -2
      r: 1
    E07000165:
      'n': Harrogate
      colour: '#2f529f'
      q: -1
      r: 1
    E08000034:
      'n': Kirklees
      colour: '#722EA5'
      q: -1
      r: -1
    E08000035:
      'n': Leeds
      colour: '#F9BC26'
      q: 0
      r: 0
    E07000169:
      'n': Selby
      colour: '#1DD3A7'
      q: 1
      r: 0
    E08000036:
      'n': Wakefield
      colour: '#EF3AAB'
      q: 0
      r: -1
    E06000014:
      'n': York
      colour: '#F92626'
      q: 0
      r: 1
data:
  - '2016': 433
    '2017': 450
    '2018': 520
    '2019': 450
    '2020': 475
    '2021': 475
    code: E08000016
    LAD21NM: Barnsley
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 500
    '2020': 500
    '2021': 525
    code: E08000032
    LAD21NM: Bradford
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 495
    '2020': 495
    '2021': 500
    code: E08000033
    LAD21NM: Calderdale
  - '2016': 550
    '2017': 560
    '2018': 550
    '2019': 575
    '2020': 575
    '2021': 580
    code: E07000163
    LAD21NM: Craven
  - '2016': 700
    '2017': 720
    '2018': 725
    '2019': 725
    '2020': 745
    '2021': 750
    code: E07000165
    LAD21NM: Harrogate
  - '2016': 475
    '2017': 495
    '2018': 495
    '2019': 500
    '2020': 500
    '2021': 525
    code: E08000034
    LAD21NM: Kirklees
  - '2016': 600
    '2017': 650
    '2018': 671
    '2019': 675
    '2020': 725
    '2021': 700
    code: E08000035
    LAD21NM: Leeds
  - '2016': 550
    '2017': 550
    '2018': 550
    '2019': 570
    '2020': 595
    '2021': 595
    code: E07000169
    LAD21NM: Selby
  - '2016': 500
    '2017': 520
    '2018': 525
    '2019': 525
    '2020': 550
    '2021': 550
    code: E08000036
    LAD21NM: Wakefield
  - '2016': 700
    '2017': 745
    '2018': 795
    '2019': 775
    '2020': 750
    '2021': 780
    code: E06000014
    LAD21NM: York
columns:
  - name: filterLabel
    template: '{{ LAD21NM }} ({{ code }})'
value: 2019
scale: Viridis
matchKey: code
tools:
  slider:
    columns:
      - '2016'
      - '2017'
      - '2018'
      - '2019'
      - '2020'
      - '2021'
    width: 500px
tooltip: >-
  Median Private Sector Rents<br />{{ LAD21NM }} ({{ _value }}):
  <strong>&pound;{{ {{ _value }} | toLocaleString() }}</strong>
attribution: >
  Data: <a
  href="https://www.westyorks-ca.gov.uk/media/8790/lcr-housing-delivery-monitoring-report-2020-21-4.pdf">West
  Yorkshire Combined Authority</a>

13. Big example§

Embeddable version

This is a large map showing local authorities coloured by region with a layout loaded from an external source. We provide a key with a title and an entry for each region. Each individual hex label is explicitly set to be an empty string.

East Anglia
East Midlands
London
North East
North West
Northern Ireland
Scotland
South East
South West
Yorkshire and the Humber
Wales
West Midlands
Hexmap.Hartlepool
E06000001Middlesbrough
E06000002Redcar and Cleveland
E06000003Stockton-on-Tees
E06000004Kingston upon Hull, City of
E06000010East Riding of Yorkshire
E06000011Darlington
E06000005Halton
E06000006Slough
E06000039Warrington
E06000007Blackburn with Darwen
E06000008Blackpool
E06000009North East Lincolnshire
E06000012York
E06000014Derby
E06000015North Lincolnshire
E06000013Leicester
E06000016Rutland
E06000017Nottingham
E06000018Herefordshire, County of
E06000019Telford and Wrekin
E06000020Stoke-on-Trent
E06000021Luton
E06000032Bath and North East Somerset
E06000022Southend-on-Sea
E06000033Bristol, City of
E06000023Brentwood
E07000068North Somerset
E06000024Worcester
E07000237South Gloucestershire
E06000025Brent
E09000005Plymouth
E06000026Thurrock
E06000034Medway
E06000035Torbay
E06000027Bracknell Forest
E06000036Kingston upon Thames
E09000021Swindon
E06000030Peterborough
E06000031West Berkshire
E06000037Reading
E06000038Windsor and Maidenhead
E06000040Wokingham
E06000041Lambeth
E09000022Milton Keynes
E06000042Brighton and Hove
E06000043Bromley
E09000006Portsmouth
E06000044Southampton
E06000045Isle of Wight
E06000046County Durham
E06000047Cheshire East
E06000049Cheshire West and Chester
E06000050Shropshire
E06000051Cornwall
E06000052Isles of Scilly
E06000053Wiltshire
E06000054Camden
E09000007Bedford
E06000055Central Bedfordshire
E06000056Northumberland
E06000057Bournemouth, Christchurch and Poole
E06000058Dorset
E06000059Buckinghamshire
E06000060Croydon
E09000008Cambridge
E07000008East Cambridgeshire
E07000009Basildon
E07000066Fenland
E07000010Bolsover
E07000033Huntingdonshire
E07000011Ealing
E09000009South Cambridgeshire
E07000012Allerdale
E07000026Barrow-in-Furness
E07000027Carlisle
E07000028Copeland
E07000029Chesterfield
E07000034Derbyshire Dales
E07000035Eden
E07000030South Lakeland
E07000031Amber Valley
E07000032Erewash
E07000036High Peak
E07000037Exeter
E07000041Mid Devon
E07000042North Devon
E07000043South Hams
E07000044North East Derbyshire
E07000038Eastbourne
E07000061South Derbyshire
E07000039Hastings
E07000062East Devon
E07000040Teignbridge
E07000045Torridge
E07000046West Devon
E07000047Lewes
E07000063Enfield
E09000010Rother
E07000064Wealden
E07000065Greenwich
E09000011Braintree
E07000067Hackney
E09000012Castle Point
E07000069Chelmsford
E07000070Colchester
E07000071Epping Forest
E07000072Harlow
E07000073Maldon
E07000074Fareham
E07000087Rochford
E07000075Tendring
E07000076Uttlesford
E07000077Cheltenham
E07000078Cotswold
E07000079Hammersmith and Fulham
E09000013Forest of Dean
E07000080Gloucester
E07000081Stroud
E07000082Gosport
E07000088Tewkesbury
E07000083Haringey
E09000014Basingstoke and Deane
E07000084Hart
E07000089East Hampshire
E07000085Eastleigh
E07000086Havant
E07000090New Forest
E07000091Rushmoor
E07000092Watford
E07000103Test Valley
E07000093Harrow
E09000015Winchester
E07000094Broxbourne
E07000095Dacorum
E07000096Hertsmere
E07000098Burnley
E07000117North Hertfordshire
E07000099Three Rivers
E07000102Ashford
E07000105Pendle
E07000122Canterbury
E07000106Dartford
E07000107Dover
E07000108Gravesham
E07000109Maidstone
E07000110Preston
E07000123Sevenoaks
E07000111Welwyn Hatfield
E07000241Folkestone and Hythe
E07000112Swale
E07000113Thanet
E07000114Tonbridge and Malling
E07000115Rochdale
E08000005Tunbridge Wells
E07000116Chorley
E07000118South Ribble
E07000126Fylde
E07000119Hyndburn
E07000120Lancaster
E07000121Salford
E08000006Ribble Valley
E07000124Rossendale
E07000125West Lancashire
E07000127Lewisham
E09000023Wyre
E07000128Blaby
E07000129Charnwood
E07000130Harborough
E07000131Hinckley and Bosworth
E07000132North West Leicestershire
E07000134Melton
E07000133Oadby and Wigston
E07000135Merton
E09000024Boston
E07000136East Lindsey
E07000137Lincoln
E07000138St. Helens
E08000013North Kesteven
E07000139North Northamptonshire
E06000061South Holland
E07000140Ashfield
E07000170South Kesteven
E07000141Gedling
E07000173West Lindsey
E07000142Breckland
E07000143Broadland
E07000144Great Yarmouth
E07000145King's Lynn and West Norfolk
E07000146North Norfolk
E07000147Norwich
E07000148South Norfolk
E07000149West Northamptonshire
E06000062Mansfield
E07000174Craven
E07000163Hambleton
E07000164Oxford
E07000178Harrogate
E07000165Richmondshire
E07000166Cannock Chase
E07000192Ryedale
E07000167Scarborough
E07000168Selby
E07000169Bassetlaw
E07000171Broxtowe
E07000172Newark and Sherwood
E07000175Ipswich
E07000202Rushcliffe
E07000176Elmbridge
E07000207Epsom and Ewell
E07000208Cherwell
E07000177South Oxfordshire
E07000179Vale of White Horse
E07000180Runnymede
E07000212West Oxfordshire
E07000181Spelthorne
E07000213Mendip
E07000187Sedgemoor
E07000188South Somerset
E07000189East Staffordshire
E07000193Lichfield
E07000194Surrey Heath
E07000214Newham
E09000025Newcastle-under-Lyme
E07000195Tandridge
E07000215South Staffordshire
E07000196Havering
E09000016Stafford
E07000197Redbridge
E09000026Staffordshire Moorlands
E07000198Tamworth
E07000199Babergh
E07000200Mid Suffolk
E07000203Wandsworth
E09000032Guildford
E07000209Manchester
E08000003Mole Valley
E07000210Reigate and Banstead
E07000211Westminster
E09000033Waverley
E07000216Woking
E07000217Ards and North Down
N09000011North Warwickshire
E07000218Nuneaton and Bedworth
E07000219Oldham
E08000004Rugby
E07000220Stratford-on-Avon
E07000221Bromsgrove
E07000234Warwick
E07000222Adur
E07000223Malvern Hills
E07000235Arun
E07000224Chichester
E07000225Crawley
E07000226Horsham
E07000227Mid Sussex
E07000228Worthing
E07000229Redditch
E07000236Wychavon
E07000238Wyre Forest
E07000239St Albans
E07000240East Hertfordshire
E07000242Stevenage
E07000243East Suffolk
E07000244West Suffolk
E07000245Somerset West and Taunton
E07000246North Tyneside
E08000022Bolton
E08000001Bury
E08000002South Tyneside
E08000023Stockport
E08000007Tameside
E08000008Trafford
E08000009Wigan
E08000010Knowsley
E08000011Liverpool
E08000012Sefton
E08000014Wirral
E08000015Barnsley
E08000016Sunderland
E08000024Doncaster
E08000017Rotherham
E08000018Sheffield
E08000019Newcastle upon Tyne
E08000021Birmingham
E08000025Coventry
E08000026Hillingdon
E09000017Dudley
E08000027Sandwell
E08000028Hounslow
E09000018Islington
E09000019Solihull
E08000029Walsall
E08000030Wolverhampton
E08000031Bradford
E08000032Calderdale
E08000033Kirklees
E08000034Wakefield
E08000036Leeds
E08000035Bexley
E09000004Gateshead
E08000037City of London
E09000001Barking and Dagenham
E09000002Barnet
E09000003Kensington and Chelsea
E09000020Richmond upon Thames
E09000027Southwark
E09000028Sutton
E09000029Tower Hamlets
E09000030Waltham Forest
E09000031Antrim and Newtownabbey
N09000001Armagh City, Banbridge and Craigavon
N09000002Belfast
N09000003Causeway Coast and Glens
N09000004Derry City and Strabane
N09000005Fermanagh and Omagh
N09000006Lisburn and Castlereagh
N09000007Mid and East Antrim
N09000008Mid Ulster
N09000009Newry, Mourne and Down
N09000010Clackmannanshire
S12000005Dumfries and Galloway
S12000006East Ayrshire
S12000008East Lothian
S12000010East Renfrewshire
S12000011Na h-Eileanan Siar
S12000013Falkirk
S12000014Highland
S12000017Inverclyde
S12000018Midlothian
S12000019Moray
S12000020North Ayrshire
S12000021Orkney Islands
S12000023Scottish Borders
S12000026Shetland Islands
S12000027South Ayrshire
S12000028South Lanarkshire
S12000029Stirling
S12000030Aberdeen City
S12000033Aberdeenshire
S12000034Argyll and Bute
S12000035City of Edinburgh
S12000036West Dunbartonshire
S12000039Renfrewshire
S12000038East Dunbartonshire
S12000045Fife
S12000047West Lothian
S12000040Angus
S12000041Dundee City
S12000042Perth and Kinross
S12000048Glasgow City
S12000049Bridgend
W06000013North Lanarkshire
S12000050Isle of Anglesey
W06000001Gwynedd
W06000002Conwy
W06000003Denbighshire
W06000004Flintshire
W06000005Wrexham
W06000006Ceredigion
W06000008Pembrokeshire
W06000009Carmarthenshire
W06000010Swansea
W06000011Neath Port Talbot
W06000012Vale of Glamorgan
W06000014Cardiff
W06000015Rhondda Cynon Taf
W06000016Torfaen
W06000020Caerphilly
W06000018Blaenau Gwent
W06000019Merthyr Tydfil
W06000024Monmouthshire
W06000021Newport
W06000022Powys
W06000023
Credit: Open Innovations

This example was made with config:

label: ''
attribution: |
  Credit: Open Innovations
columns:
  - name: filterLabel
    template: '{{ n }} ({{ RGNNM }})'
tooltip: '{{ n }}<br />{{ _id }}'
legend:
  title: Key
  position: top
  items:
    - value: '#FF6700'
      label: East Anglia
    - value: '#00B6FF'
      label: East Midlands
    - value: '#D73058'
      label: London
    - value: '#D60303'
      label: North East
    - value: '#1DD3A7'
      label: North West
    - value: '#722EA5'
      label: Northern Ireland
    - value: '#2254F4'
      label: Scotland
    - value: '#67E767'
      label: South East
    - value: '#178CFF'
      label: South West
    - value: '#F9BC26'
      label: Yorkshire and the Humber
    - value: '#0DBC37'
      label: Wales
    - value: '#E6007C'
      label: West Midlands
hexjson: hexjson.localauthorities
value: colour
tools:
  filter:
    label: filterLabel
min: 0
max: 1