Vega-lite: Unit charts and `stack=unit` option?

Created on 12 Aug 2017  路  6Comments  路  Source: vega/vega-lite

Unit Charts are really helpful when you want to do large multi-dimensional data exploration. See recent example of Facet Dive tool from PAIR - https://pair-code.github.io/facets/

facet-dive

I experimented with creating Unit Charts in Vega-Lite and you can see the examples for Rectangular, Stacked & Small Multiple Unit Charts in these blocks. See image for Rectangular Unit Chart below.

thumbnail

It is possible to hack & create them (with some manual assumption on sizing) using transform, if you already have a primary key e.g. id in your datasets.

  "transform": [
    {"calculate": "ceil(datum.id/ 10)", "as": "X"},
    {"calculate": "datum.id - (datum.X - 1) *10", "as": "Y"}
  ]

This works fine at the top-level, but when trying to do small multiples or stacking on x, I need to again create keys at that level. See example for Stacked Unit Chart.

thumbnail

Two questions:

  1. Is there currently an easier way to create Unit Charts, without pre-processing the data and creating these keys manually? Is there a way to access a key id, after the top-level transforms for the data have been done?
  2. If not, are there any plans to support this in the future? It would be great to have an easy way to do these three unit chart behaviours:

    • Stack the space vertically, if xchannel only has a field.

    • Stack the space horizontally, if y is only has a field

    • Fill the cell space , if neither x or y channel has a field.

We can have an option in the stack encoding called unit, which would make this behaviour happen. However, I don't know how easy this is to implement, or what the impact of this change would be on the current defaults. Just wanted to suggest this as maybe one possible route to take, if you decide to implement this. Thanks.

Most helpful comment

@amitkaps Thanks for helping out! Since the major concern for any new feature in Vega-Lite is how it fits into the overall design, I would propose that you create a design proposal before implementing this feature. We can help you by reviewing the design and telling you what parts of the compiler it affects.

All 6 comments

CC @StevenMDrucker @intuinno

On further investigation, the transform function from Vega that would make at least the vertical and horizontal stacking straightforward is the window transform. That provides access to a row_number field - with or without groupby operations. See the Vega code block for Stacked Unit Chart - https://bl.ocks.org/amitkaps/afc67606c057d1c8021d0f8e0d2cfa3e

So maybe the right starting point would be to expose the window function as a top-level transform in Vega-Lite. It would also help in doing moving averages for time-series charts.

Vega and D3 stack operator only does 1D stacking, so this wouldn't be a property of stack.

But yes, window transform can be added to Vega-Lite but we don't plan to do that for 2.0.

You're welcome to submit a PR though. :)

Thanks @kanitw Will take a shot at it and send a PR.

@amitkaps Thanks for helping out! Since the major concern for any new feature in Vega-Lite is how it fits into the overall design, I would propose that you create a design proposal before implementing this feature. We can help you by reviewing the design and telling you what parts of the compiler it affects.

We actually have https://github.com/vega/vega-lite/issues/2488 for window, so I'm closing this.

If you still planning to send in a PR, please let us know.

Was this page helpful?
0 / 5 - 0 ratings