Barchart Grouping by Time/Step/Count

W&B Help
2

After fiddling a bit more with the Custom Chart functionality, I got a half-baked solution.

The biggest issue when trying to implement a Custom Chart is to watch out for the difference between vega and vega-lite.

Examples from the vega-lite documentation are mostly easily adaptable while the ones from vega DO NOT WORK.

I didn’t dig quite deep enough to understand why, but it seems to have something to do with the way wandb provides its data.

However, here’s the code for anybody interested in the following boxplot. It has basic tooltips and a configurable range. If you want the 1.5 IQR boxplot instead of the min-max one, simply remove this line "extent": "min-max".

Screenshot_20220920_135209
Screenshot_20220920_135209842×439 47 KB

Configuration:

Screenshot_20220920_135547
Screenshot_20220920_135547492×784 27.4 KB 

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "description": "A simple box plot from https://vega.github.io/vega-lite/examples/boxplot_2D_vertical.html, refer to the full documentation here https://vega.github.io/vega-lite/docs/boxplot.html",
  "title": "${field:y}",
  "data": {
    "name": "wandb"
  },
  "layer":[
  { 
    "mark": {
      "type": "boxplot",
      "extent": "min-max",
      "clip": true,
      "median": { "color": "black" },
      "ticks": true
    },
    "encoding": {
      "size":{ "value": 25},
      "x": {
        "field": "${field:group_by}",
        "type": "nominal",
        "axis": {"labelAngle": -25}
      },
      "y": {
        "field": "${field:y}",
        "type": "quantitative",
        "sort": "-y",
        "scale": {"domain": ["${string:min_domain}", "${string:max_domain}"]},
        "title": null
      },
      "color": {
        "field": "${field:group_by}",
        "type": "nominal"

      },
      "tooltip": [
        { "field": "${field:y}", "type":"quantitative" }
      ]
    }
  }
  ],
  "config": {
    "axis": { "grid": true },
    "view": {
      "stroke": "transparent"
    }    
  }
}

Some things to watch out for:

  • vega-lite seems to be a wrapper around vega, and the boxplot primitive creates a lot of layers that are not modifiable by default (as do other primitives)
  • I presume that this is the reason I did not get any transforms working that are in the default Line plot
  • the GraphQL input in the second image is sometimes buggy and does not allow you to select the correct field but you can work around that by typing something in the first field, then <Tab> and selecting the second field, then deleting the first one (Brave Build: Version 1.42.97 Chromium: 104.0.5112.102)
  • When in the “Chart Definition” view (Custom Chart -> Edit), data recomputation is delayed/buggy. If you change the chart code, you might need to re-select the fields to see the changes (e.g., group_by for me)
  • When in the “Chart Definition” view, just below the chart is a dropdown list of the generated/imported data. Use that extensively to make sure that your transforms do what you want them to do!

A nice improvement from this boxplot would be to have violin plots, but these still seem to be in active development, see this issue.

–

Final thoughts: I would still love to have a group-by time/count in the default Bar chat as it would integrate much more tightly with the remaining look of the dashboard and would provide violin plots by default.