Stacking binned dots using Plot?

I am experimenting with the new Plot library and since I am completely new to JavaScript I think this is perfect for me, as it isn’t as complex as D3 to get started with.

Now I would like to do a diagram similar to what can be done with ggplot2’s geom_dotplot (see Dot plot — geom_dotplot • ggplot2) where the data is binned (along either the X or Y axis) and then stacked along the other axis, so that the data in fact only needs one dimension (the one which is used for the binning). Any idea how can I achieve this with Plot?



here’s a solution:

  marks: [
      Plot.stackY(Plot.binX({}, { x: "x", z: data, thresholds: 30, r: 10 }))
  height: 150



Thanks! I had missed the stackY() transform…

For the binX() transform I also specified the title channel to get a tooltip. The input to the function I specified was always an array of length 1, whereas in my other examples it was the data object itself (no wrapping array). This probably works as designed, but I didn’t find anything in the documentation hinting at this.

1 Like

Yes. A title: function(d) { return } (without specifying a title input) receives the index and series as input, where the series is the subset of all data with the same z, in this case an array of 1 since each dot represents 1 car.

We could also add a title on each dot with a title: "name" input and a title:"first" reducer.

1 Like