Mapping with Vega-lite

Basemaps

Simple maps: Welsh and Scottish borders. The basic building blocks are geographic data and a geoshape mark.

...
  "data": {"url": "scotland.topojson"},
  "mark": "geoshape",
...

Subdivisions.

These maps show subdivisions but the basic setup is the same: a single data source and a `geo_shape` mark.

Point maps

Adding points to maps requires understanding layers. Let's build this step by step:

1. Basemap Foundation

{
  "data": {"url": "ITL1_2021_20m.geojson"},
  "mark": {"type": "geoshape", "fill": "lightgray"}
}

2. Points with Geographic Encoding

Points use longitude/latitude encoding instead of x/y. Size can represent data values:

{
  "data": {"url": "UK_airports2.csv"},
  "mark": "circle",
  "encoding": {
    "longitude": {"field": "longY"},
    "latitude": {"field": "latX"}, 
    "size": {"field": "Aircraft Movements"}
  }
}

3. Layered Composition

The layer specification combines multiple mark types with shared projections:

{
  "layer": [
    {"data": {...}, "mark": "geoshape"},
    {"data": {...}, "mark": "circle", "encoding": {...}}
  ],
  "projection": {"type": "mercator"}
}

Power Plants by Fuel Type

This chart has another encoding: color for the fuel type.

{
  "data": {"url": "uk_power_plants.csv"},
  "mark": "circle",
  "encoding": {
    "longitude": {"field": "longitude"},
    "latitude": {"field": "latitude"},
    "color": {"field": "fuel_category", "type": "nominal"},
    "size": {"field": "capacity_mw", "type": "quantitative"}
  }
}

Choropleths

These choropleths demonstrate data-driven color encoding using 2024 wage data. The geographic regions are associated with rows in the CSV using a lookup transform.

{
  "data": {"url": "LAD_SCT_2025_05.topojson"},
  "transform": [
    {"lookup": "properties.LAD25CD", "from": {"data": {"url": [...]}}}
  ],
  "mark": "geoshape",
  "encoding": {
    "color": {"field": "value", "type": "quantitative"}
  }
}