How to layer 2 graphs with Vega-lite from two different datasets?

Hi all! I am a baby javascipt/observable user :baby_chick:. I am trying to layer/plot to bar charts together from different datasets:

The first one looks like this:

0: Object {date: 2016-09-05T12:00:48Z, count: 1, Symbol(vega_id): 1}
1: Object {date: 2016-09-05T12:52:21Z, count: 1, Symbol(vega_id): 2}
2: Object {date: 2016-09-05T13:49:04Z, count: 1, Symbol(vega_id): 3}
3: Object {date: 2016-09-05T13:49:04Z, count: 1, Symbol(vega_id): 4}
4: Object {date: 2016-09-05T13:49:06Z, count: 1, Symbol(vega_id): 5}
5: Object {date: 2016-09-05T13:54:15Z, count: 1, Symbol(vega_id): 6}

The second one:

days = Array(7) [
  0: Object {name: "Monday", number: 2, Symbol(vega_id): 2748}
  1: Object {name: "Tuesday", number: 8, Symbol(vega_id): 2749}
  2: Object {name: "Wednesday", number: 2, Symbol(vega_id): 2750}
  3: Object {name: "Thursday", number: 9, Symbol(vega_id): 2751}
  4: Object {name: "Friday", number: 6, Symbol(vega_id): 2752}
  5: Object {name: "Saturday", number: 3, Symbol(vega_id): 2753}
  6: Object {name: "Sunday", number: 8, Symbol(vega_id): 2754}

Do I have to make one look like the other? or join both datasets into one?

What I am thinking is that I have to group the dates by weekday in the first dataset and then merge the two.

Thank you for your help and have a nice day :sunny:.

Can you perhaps sketch out what you want the chart to show? Are you thinking of summing the โ€˜countโ€™ column in the first dataset across all dates by weekday? And how would you like to show the two datasets on the bar chart?

You probably want to use the d3.rollup function. Here is an example notebook that uses rollup to sum up the values in the first dataset by day of week:

Perhaps also worth noting that Vega-Lite itself has the ability to group-by while aggregating, so depending on what you want to achieve you may be able to do this directly from within your Vega-Lite spec.

1 Like