Article pageviews test spec

articles_test.json

{
  "debug": 1,
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "description": "A bar chart of flight statistics, aggregated by the selected time unit.",
  "width": 500,
  "height": 500,
  "padding": 5,
  "autosize": {"type": "fit", "resize": true, "contains": "padding"},

  "title": {
    "text": "Article views",
    "subtitle": "",
    "subtitleFontStyle": "italic",
    "frame": "group",
    "anchor": "start",
    "offset": 10
  },

  "data": [
    {
      "name": "article0",
      "url": "https://wikimedia.org/api/rest_v1/metrics/pageviews/per-article/en.wikipedia.org/all-access/user/Wikipedia%3AWikipedia_Signpost%2F2022-08-01%2FFrom_the_editors/monthly/20220701/20221101",
      "format": {"type": "json", "parse": "auto"}
    },
    {
      "name": "article1",
      "url": "https://wikimedia.org/api/rest_v1/metrics/pageviews/per-article/en.wikipedia.org/all-access/user/Wikipedia%3AWikipedia%20Signpost%2F2022-08-01%2FEssay/monthly/20220701/20221101",
      "format": {"type": "json", "parse": "auto"}
    },
    {
      "name": "article2",
      "url": "https://wikimedia.org/api/rest_v1/metrics/pageviews/per-article/en.wikipedia.org/all-access/user/Wikipedia%3AWikipedia%20Signpost%2F2022-08-01%2FElection%20guide/monthly/20220701/20221101",
      "format": {"type": "json", "parse": "auto"}
    },
    {
      "name": "agg",
      "source": [
        "article0",
        "article1",
        "article2"
      ],
      "transform": [
        {
          "type": "flatten",
          "fields": ["items"],
          "index": "idx"
        },
        {
          "type": "formula",
          "expr": 
"replace(substring(datum.items.article, lastindexof(datum.items.article, '/') + 1), regexp(/_/, 'ig'), ' ')",
          "as": "shortname"
        }
      ]
    },
    {
      "name": "proj",
      "source": "agg",
      "transform": [
        {
          "type": "project",
          "fields": [
            "items.timestamp",
            "items.views",
            "shortname"
          ],
          "as": [
            "timestamp",
            "views",
            "article"
          ]
        }
      ]
    },
    {
      "name": "totals",
      "source": "proj",
      "transform": [
        {
          "type": "aggregate",
          "fields": ["views"],
          "as": ["views"],
          "ops": ["sum"],
          "groupby": ["article"]
        }
      ]
    },

    {
      "name": "pageviews",
      "source": "proj",
      "transform": [
        {
          "type": "stack",
          "groupby": ["article"],
          "field": "views",
          "sort": {
            "field": "timestamp",
            "order": "ascending"
          }
        }
      ]
    }
  ],
  "scales": [
    {
      "name": "xscale",
      "type": "band",
      "domain": {"data": "totals",
      "field": "article"},
      "range": "width",
      "padding": 0.1,
      "align": 0.0
    },
    {
      "name": "yscale",
      "type": "linear",
      "domain": {"data": "totals", "field": "views"},
      "range": "height",
      "round": true
    },
    {
      "name": "color",
      "type": "ordinal",
      "range": {"scheme": "category10"}
    }
  ],

  "axes": [
    {"orient": "left", "scale": "yscale"},
    {"orient": "bottom", "scale": "xscale"}
  ],
  "marks": [
    {
      "type": "group",
      "name": "boxes",
      "from": {"data": "totals"},
      "encode": {
        "enter": {
          "stroke": {"value": "black"},
          "fill": {"value": "gray"},
          "x": {
            "scale": "xscale",
            "field": "article",
            "offset": 0.5
          },
          "width": {"scale": "xscale", "band": 1}
        },
        "update": {
          "y": {"scale": "yscale", "value": 0, "offset": 0.5 },
          "y2": {"scale": "yscale", "field": "views", "offset": 0.5}
        }
      }
    },
    {
      "type": "rect",
      "from": {"data": "pageviews"},
      "encode": {
        "enter": {
          "fill": {"scale": "color", "field": "timestamp"},
          "stroke": {"value": "white"},
          "strokeWidth": {"value": 1},
          "x": {"scale": "xscale", "field": "article", "offset": 0.5},
          "width": {"scale": "xscale", "band": 1}
        },
        "update": {
          "y": {"scale": "yscale", "field": "y0", "offset": 0.5},
          "y2": {"scale": "yscale", "field": "y1", "offset": 0.5}
        }
      }
    },
    {
      "type": "text",
      "from": {"data": "boxes"},
      "encode": {
        "enter": {
          "fill": {"value": "black"},
          "fontWeight": {"value": "bold"},
          "text": {"field": "datum.views"},
          "fontSize": {"value": 12},
          "x": {"field": "x", "offset": 4},
          "width": {"scale": "xscale", "band": 1},
          "align": {"value": "left"}
        },
        "update": {
          "y": {"field": "y", "offset": -4}
        }
      }
    }
  ]
}