Observable

Find inspiration and techniques to create beautiful and appropriate charts with Observable Plot. This collection highlights best practices and real use cases.

Plot Examples

Jeremy Beasley

Also, trying to grok the difference between this ridgeline plot and the horizon charts also referenced. Is the primary difference based on whether the areas are clipped (in the horizon charts) versus not in the ridgeline plots?

The precision is the number of pixels that represent a difference in quantity. For example if the height is 10px for a difference of 10 in value, the precision is 1px per unit. Higher precision makes it easier to read variations (the line goes up or down "faster").

However in a ridgeline plot, if you increase the precision, the shapes must go higher (for a given dataset), which can lead to occlusion as you can see below.

By construction, the horizon chart avoids occlusion (thanks to clipping, each band stays in the same "lane"); but, to be able to represent large values with good precision, it needs many bands. When the precision is high, the variations are still very easy to read, but as the number of bands increases, it can become difficult to read the absolute value (since you need to read the band's color to know that band's baseline value).

I hope this helps.