Repository: vega/vega-lite

Issue #9321: Not possible to independently resolve latitude / longitude in concatenated geoshape chart with same projection
Created: 2024-04-25T17:46:15Z
Bug Description
When concatenating two geoshape charts it is not possible to independently resolve the latitude and longitude when the same projection is used. As an example, consider a chart showing two US states side by side.
If we plot them separately, we get results exactly as we would expect, with the chart automatically adjusting the extent to the size of the data.
State A:
Open the Chart in the Vega Editor
{
  "config": {"view": {"continuousWidth": 300, "continuousHeight": 300}},
  "hconcat": [
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 49)"}],
      "projection": {"type": "albersUsa"}
    }
  ],
  "data": {
    "url": "https://cdn.jsdelivr.net/npm/vega-datasets@v1.29.0/data/us-10m.json",
    "format": {"feature": "states", "type": "topojson"}
  },
  "$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json"
}

State B:
Open the Chart in the Vega Editor
{
  "config": {"view": {"continuousWidth": 300, "continuousHeight": 300}},
  "hconcat": [
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 20)"}],
      "projection": {"type": "albersUsa"}
    }
  ],
  "data": {
    "url": "https://cdn.jsdelivr.net/npm/vega-datasets@v1.29.0/data/us-10m.json",
    "format": {"feature": "states", "type": "topojson"}
  },
  "$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json"
}

However, if we concatenate them the extent in each changes as if it were showing both states. I have attempted to set all of the resolve settings to independent, but none of them had any affect.
Open the Chart in the Vega Editor
{
  "config": {"view": {"continuousWidth": 300, "continuousHeight": 300}},
  "hconcat": [
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 49)"}],
      "projection": {"type": "albersUsa"}
    },
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 20)"}],
      "projection": {"type": "albersUsa"}
    }
  ],
  "data": {
    "url": "https://cdn.jsdelivr.net/npm/vega-datasets@v1.29.0/data/us-10m.json",
    "format": {"feature": "states", "type": "topojson"}
  },
  "$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json"
}

If we additionally change the projection of each chart to something different, we get the expected behavior where each chart's extent is only for its data.
Open the Chart in the Vega Editor
{
  "config": {"view": {"continuousWidth": 300, "continuousHeight": 300}},
  "hconcat": [
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 49)"}],
      "projection": {"type": "albersUsa"}
    },
    {
      "mark": {"type": "geoshape"},
      "transform": [{"filter": "(datum.id === 20)"}],
      "projection": {"type": "albers"}
    }
  ],
  "data": {
    "url": "https://cdn.jsdelivr.net/npm/vega-datasets@v1.29.0/data/us-10m.json",
    "format": {"feature": "states", "type": "topojson"}
  },
  "$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json"
}

As users will generally want all maps in the same projection it would be desirable for each chart to independently resolve the extent without changing the projection.
I previously posted this on stack overflow as an Altair question and was asked to repost this here as an issue by @joelostblom.
Thanks!
Checklist

 I checked for duplicate issues.

Duplicate issue #9264: map does not fit inside its view in vega-lite
Created: 2024-02-16T08:53:03Z
hello,
with a vconcat/hconcat mix  of layered views representing maps, the map does not fit inside the boundary of it's layer
and sometimes does not show up, or explodes outside of the boundary of it's layer
if the map is in a single view, no problem.
here the layers are materialized  with stroke orange, all maps are here but only some show up
if I tweek the width and height I may get other map showing up but it's not very predictable

  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "autosize": "pad",
  "config": {"concat": {"spacing": 5}},
  "vconcat": [
    {
      "hconcat": [
        {
          "vconcat": [
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/martinique.geojson"},
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "martinique",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            },
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/guadeloupe.geojson"},
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "guadeloupe",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            },
            {
              "height": 100,
              "layer": [
                {
                  "data": {
                    "url": "/assets/departements/stmartin_barth.geojson"
                  },
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "stmartin_barth",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            },
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/guyane.geojson"},
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "guyane",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            }
          ]
        },
        {
          "height": 400,
          "layer": [
            {
              "data": {"url": "/assets/departements/metropole.geojson"},
              "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
            }
          ],
          "projection": {"type": "mercator"},
          "title": "metropole",
          "view": {"fill": "null", "stroke": "orange"},
          "width": 400
        },
        {
          "vconcat": [
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/mayotte.geojson"},
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "mayotte",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            },
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/reunion.geojson"},
                  "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "reunion",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            },
            {
              "height": 100,
              "layer": [
                {
                  "data": {"url": "/assets/departements/polynesie.geojson"},
                  "mark": {"fill": "blue", "stroke": "grey", "type": "geoshape"}
                }
              ],
              "projection": {"type": "mercator"},
              "title": "polynesie",
              "view": {"fill": "null", "stroke": "orange"},
              "width": 100
            }
          ]
        }
      ]
    },
    {
      "hconcat": [
        {
          "height": 100,
          "layer": [
            {
              "data": {"url": "/assets/departements/ncaledonie.geojson"},
              "mark": {"fill": "null", "stroke": "grey", "type": "geoshape"}
            }
          ],
          "projection": {"type": "mercator"},
          "title": "ncaledonie",
          "view": {"fill": "null", "stroke": "orange"},
          "width": 100
        }
      ]
    }
  ]
}

Closing comment (2024-04-26T16:58:34Z): Hi @blset, I think this could be related to #9321. If you slightly tweak the projection precision in each of the concatenated maps, does it solve your problem?