Search code examples
vega-litevega

Vega Lite Repeat Charts and Labeling


See code here

I am working on a prototype dashboard and had fun so far building it with Vega Lite. However, I hit a road block on the following points:

  1. I want to add a P10 and P90 line on all the bar charts. I have followed the tutorial for the single bar chart with line but I was not able to work it with repeat charts.
  2. Adding labels on every single bar similar to this tutorial but could not make it work with the repeat charts
  3. I want to add a second pie chart which will be identical to the one I have except that the values will be multiplied with a constant. I tried a nested concat but it didn't work. The charts disappeared without an error.
  4. I failed to replicate this tutorial for selecting and higlighting and I would appreciate the help
  5. Is it possible to add filtered data tables in Vega or Vega lite?

Solution

  • Check the code here

    1. For adding the line on bar chart, you can provide layer config as an array inside the spec object and provide multiple marks for it.
    2. Similarly, add mark config with value text inside the layer. So, that will help to add the labels.
    3. A similar pie chart is added at the bottom but the values of this pie chart is achieved by multiplying it with a value. For example: 5. The pie chart gets disappeared because it share the same axis or we can say theta config. To fix that you need to add a resolve config. Check the documentation for resolve config.
    4. The selection configuration given in this tutorial has been added in the layer, where the mark bar is provided.
    5. In vega or vega-lite, the data can be filtered using the transform config. Its use is somewhat similar to the calculate config which was used in your code. Check the documentation for filter transform.