Vega lite Geographic chart: does zoom on mouse scroll feature exist?

Question

I am using this map https://vega.github.io/vega-lite/examples/geo_layer.html and I'm wondering if there is a zoom function in principle here? Found nothing in docs.

Answer 1

You can zoom the map manually by changing the scale factor of the projection as below. To actually bind this to mouse scroll is not currently supported as far as I'm aware. There is an open issue here you can rad about: https://github.com/vega/vega-lite/issues/3306

If I were you, I'd just use Vega and there is already an example here: https://vega.github.io/vega/examples/zoomable-world-map/

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "width": 500,
  "height": 300,

  "layer": [
    {
      "data": {
        "url": "data/us-10m.json",
        "format": {
          "type": "topojson",
          "feature": "states"
        }
      },
      "projection": {
        "type": "albersUsa", "scale":300
      },
      "mark": {
        "type": "geoshape",
        "fill": "lightgray",
        "stroke": "white"
      }
    },
    {
      "data": {
        "url": "data/airports.csv"
      },
      "projection": {
        "type": "albersUsa", "scale":300
      },
      "mark": "circle",
      "encoding": {
        "longitude": {
          "field": "longitude",
          "type": "quantitative"
        },
        "latitude": {
          "field": "latitude",
          "type": "quantitative"
        },
        "size": {"value": 10},
        "color": {"value": "steelblue"}
      }
    }
  ]
}