Search code examples
jsonvisualizationdata-analysisvega-litevega

Vega lite grouped bar chart for time series


I'm trying to create a bar grouped bar chart for time series data. There are 2 series, sampled at the same interval. The stacked bar chart looks like this:

enter image description here

Code: Vega lite editor code

Now, instead of stacking them, I like to create a grouped bar chart as described in the docs:

enter image description here

The xOffset parameter doesn't seem to like the temporal axis, though:

enter image description here

The bars are on top of each other instead of next to each other: Adapted code

Any tips on how to solve this?


Solution

  • You have too many data points. Adding the timeunit:month achieves this:

    enter image description here

     "x": {
              "field": "date",
              "type": "temporal", "timeUnit": "month",
              "title": null,
              "axis": {"labelAngle": -70},
              "sort": null
            },
    

    Or this:

    enter image description here

       "x": {
              "field": "date",
              "type": "temporal",
              "timeUnit": "month",
              "title": null,
              "axis": {
                "tickCount": 8,
                "labelAlign": "left",
                "labelExpr": "[timeFormat(datum.value, '%b'), timeFormat(datum.value, '%m') == '01' ? timeFormat(datum.value, '%Y') : '']",
                "labelOffset": 4,
                "labelPadding": -24,
                "tickSize": 30
              },
              "sort": null
            },