Visualising Data Using Vega-Lite

Are there any examples/tutorials using vega-lite with datahub.io? - I assumed not based on this GH Issue comment. Or examples of using the simple vis spec for scatterplots?

I've looked in these places but couldn't find much information:

The only vega-lite specific detail I found was in the latter link which says

The approach for Vega-Lite is similar to the approach for Vega. Instead of specifying the data in the Vega-Lite spec itself, only use named datasets.

This particular comment also made me wonder whether vega-lite was supported at all.

In my use-case I'm trying to visualise the x and y fields of this data-package as a scatterplot - datahub.io/ayrtonbourn/every-noise. I can visualise it locally using vega-lite but not on the datahub.

When I upload the data-package to the hub I can initially see where the view should be (showing This view will be available once the dataset is processed.), but once the package has finished processing it shows as blank.

The view I'm using is as follows:

...
"views": [
    {
        "name": "genre-map",
        "title": "Genre Map",
        "resources": ["genre-attributes"],
        "specType": "vega-lite",
        "spec": {
          "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
          "description": "A scatterplot showing the Spotify genre space",
          "data": {"name": "genre-attributes"},
          "mark": "point",
          "encoding": {
            "x": {"field": "x", "type": "quantitative"},
            "y": {"field": "y", "type": "quantitative"}
          }
        }
    }
]
...

I also tested vega-lite more generally using the example from https://old.frictionlessdata.io/specs/views/

{
  "title": "My amazing bar chart",
  "resources": [
    {
      "name": "table",
      "data": [
        {"x": 1,  "y": 28}, {"x": 2,  "y": 55},
        {"x": 3,  "y": 43}, {"x": 4,  "y": 91},
        {"x": 5,  "y": 81}, {"x": 6,  "y": 53},
        {"x": 7,  "y": 19}, {"x": 8,  "y": 87},
        {"x": 9,  "y": 52}, {"x": 10, "y": 48},
        {"x": 11, "y": 24}, {"x": 12, "y": 49},
        {"x": 13, "y": 87}, {"x": 14, "y": 66},
        {"x": 15, "y": 17}, {"x": 16, "y": 27},
        {"x": 17, "y": 68}, {"x": 18, "y": 16},
        {"x": 19, "y": 49}, {"x": 20, "y": 15}
      ]
    }
  ],
  "specType": "vega-lite",
  "spec": {
    "data": {"name": "table"},
    "mark": "bar",
    "encoding": {
      "x": {"field": "a", "type": "ordinal"},
      "y": {"field": "b", "type": "quantitative"}
    }
  }
}

But that didn't work either, the (non-)result can be found here.

I've also tested with older versions of the vega-lite spec in case the datahub isn't using the latest, but this also didn't solve it. Specifically, I tested v3 as I can see from this GH Issue that the datahub should handle that. The result of this attempt can be found here.

datopian / datahub-qa

Visualising Data Using Vega-Lite #288