Loading feature data into Vega-Lite

Question

I'm trying to plot area shapes using vega-lite but the following area is being reported.

[Warning] Dropping {"type":"geojson"} from channel "shape" since it does not contain any data field, datum, value, or signal.

The data is being successfully loaded as I can see it the vega-lite editor/ viewer and it I've included a couple of records below and in the link to the vega-lite snippet .

I think the trouble is pointing the right fields in the data.

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {
    "values": [
      {
        "OBJECTID": 4691,
        "WD21CD": "E05011118",
        "WD21NM": "Acocks Green",
        "WD21NMW": " ",
        "BNG_E": 412052,
        "BNG_N": 282830,
        "LONG": -1.8241,
        "LAT": 52.4433,
        "SHAPE_Length": 0.0924,
        "SHAPE_Area": 0.0005,
        "geometry": {
          "type": "MultiPolygon",
          "coordinates": [
            [
              [
                [-1.8093, 52.4454],
                [-1.8173, 52.4324],
                [-1.8253, 52.4293],
                [-1.839, 52.4341],
                [-1.8355, 52.4382],
                [-1.831, 52.4483],
                [-1.8345, 52.4522],
                [-1.824, 52.4571],
                [-1.8139, 52.4547],
                [-1.8093, 52.4454]
              ]
            ]
          ]
        }
      },
      {
        "OBJECTID": 4692,
        "WD21CD": "E05011119",
        "WD21NM": "Allens Cross",
        "WD21NMW": " ",
        "BNG_E": 401463,
        "BNG_N": 279538,
        "LONG": -1.9799,
        "LAT": 52.4138,
        "SHAPE_Length": 0.0959,
        "SHAPE_Area": 0.0002,
        "geometry": {
          "type": "MultiPolygon",
          "coordinates": [
            [
              [
                [-1.9618, 52.4212],
                [-1.9717, 52.4163],
                [-1.9758, 52.4079],
                [-1.9835, 52.4095],
                [-1.9978, 52.4097],
                [-1.986, 52.4167],
                [-1.975, 52.4205],
                [-1.9807, 52.4247],
                [-1.9754, 52.4268],
                [-1.9679, 52.4214],
                [-1.9618, 52.4212]
              ]
            ]
          ]
        }
      }
    ],
    "format": {"type": "json"}
  },
  "mark": "geoshape",
  "encoding": {"shape": {"type": "geojson"}},
  "width": 500,
  "height": 500
}

Answer 1

It turns out my json was not formed correctly. I had used jsonlite::toJSON in R to convert an Simple Feature to json but should have used geojsonsf::sf_geojson(). The former only includes the contents of the feature.properties.

For more info, see Convert data to Json with all objects included

The correct code is as follows, note the data definition, where the FeatureCollection and features are defined.

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {
    "values": {
      "type": "FeatureCollection",
      "features": [
        {
          "type": "Feature",
          "properties": {
            "OBJECTID": 4691,
            "WD21CD": "E05011118",
            "WD21NM": "Acocks Green",
            "BNG_E": 412052,
            "BNG_N": 282830,
            "LONG": -1.82411,
            "LAT": 52.443321,
            "SHAPE_Length": 0.09237554909129655,
            "SHAPE_Area": 0.000522111171395259
          },
          "geometry": {
            "type": "MultiPolygon",
            "coordinates": [
              [
                [
                  [-1.809263305999934, 52.44539377400008],
                  [-1.817314732999932, 52.43236735700003],
                  [-1.825263312999937, 52.42930558300003],
                  [-1.839003390999949, 52.434050100000036],
                  [-1.809263305999934, 52.44539377400008]
                ]
              ]
            ]
          }
        },
        {
          "type": "Feature",
          "properties": {
            "OBJECTID": 4692,
            "WD21CD": "E05011119",
            "WD21NM": "Allens Cross",
            "WD21NMW": " ",
            "BNG_E": 401463,
            "BNG_N": 279538,
            "LONG": -1.97991,
            "LAT": 52.413849,
            "SHAPE_Length": 0.09592937334184568,
            "SHAPE_Area": 0.00023886389782556888
          },
          "geometry": {
            "type": "MultiPolygon",
            "coordinates": [
              [
                [
                  [-1.961811859999955, 52.42117633300006],
                  [-1.971725540999955, 52.41631029900003],
                  [-1.975847800999929, 52.40792152500006],
                  [-1.983516194999936, 52.409539153000026],
                  [-1.967944932999956, 52.42144882300005],
                  [-1.961811859999955, 52.42117633300006]
                ]
              ]
            ]
          }
        }
      ]
    },
    "format": {"type": "json", "property": "features"}
  },
  "mark": {"type": "geoshape", "strokeWidth": "1", "stroke": "White"},
  "encoding": {
    "tooltip": {"field": "properties.WD21NM"},
    "shape": {"type": "geojson"}
  },
  "width": 500,
  "height": 500
}