Engaging Notebooks of Jan 2022

Welcome to the first edition of a monthly summary of what is hot on the Observable Dataviz platform. There is so much activity it is sometimes hard to stay up to date and not miss anything juicy. This newsletter is dedicated to finding the gems. Last month two notebooks tweeted by the trending bot in particular found some resonance in the broader community.

Engagement, Impressions, Likes and Retweets

First, the prolific @fil scored a hit with a technical dimension reduction technique for summarizing time-series data called topological subsampling. It's pleasing to see technical posts do so well, I think Fil did a fantastic job of explaining the technique very well, and my hypothesis why it did so well is that it ultimately solves a very practical problem of transmitting just the salient information very efficiently. You can use the technique to speed up various parts of Dataviz, including bandwidth minimization or speeding up rendering pipelines.

The second big hit was @neocartocnrs introduction to his library Bertin.js. Bertin.js is a geo library to help render beautiful thematic maps. We are very excited because @neocartocnrs is a long-time Observablehq user and professional cartographer, and his library seems to be a manifestation of the move toward declarative style DataViz that the Observablehq community is moving towards. We wish you good luck Nicolas Lambert with Berin.js!

Of course, there were many other great notebooks, check the rest of January's trending notebooks below! Also if you have not seen, there is a list of the 100 notebooks in 2021.

Time series topological subsampling by @fil

Using topological data analysis (TDA), we can extract meaningful points from a time series. This can be used to simplify a line (to take it from millions of points to a few hundreds), or to add some labels to a chart, highlighting “important” points such as relative extrema. The approach is inspired by (my reading of) Paul Rosen (et al.


Hello Bertin.js by @neocartocnrs

bertin.js is an easy to use wrapper around d3js to facilitate the process of making thematic maps. The principle is to work with layers stacked on each other. As in a GIS, the layers that are displayed above are placed at the top in the code, the layers that are displayed below are placed at the bottom in the code. The layers that can be displayed are of several types: header, footer, graticule, outline, choro, typo, prop, shadow, scalebar, text... Each type has its own parameters.


Plot of plots by @fil

With Plot.image we can create small multiples charts (or “collections of maps”, as Bertin writes), in which we make a parameter vary along the x and y axes.


D3 Gallery does not expose the raw data of its notebook listings. This notebook demonstrates a workaround to obtain them anyway. To create your own listings, import the data via Data On import we replace previews() with our own function attach() that only returns an empty DOM node with the data attached. We can then iterate over the rendered category contents to obtain the node and its data.


Clifford and de Jong Attractors by @rreusser

This notebook interactively implements the discrete attractors of Clifford Pickover and Peter de Jong. You can pan and zoom using the mouse or a touch screen. Clifford attractors are defined by while de Jong attractors are defined by A grid of points is offset randomly and iterated some fixed numbers of times, after which the points are accumulated onto a WebGL texture, effectively computing a histogram of the attractor.


These other notebooks also trended in Jan

Plot Cheatsheets by @observablehq

Genuary 2022 / 5 by @mbostock

Wall Drawing 87 by @sahilchinoy

Convert Image to One Bit by @iamgrahamallen

White Noise vs Pachinko Tree Dithering by @jobleonard

Interactive Regl Wind Demo by @dkaoster

Sampling mood by @tophtucker

Vector Mark / Observable Plot by @observablehq

WEBCode.run Private Endpoints Released by @endpointservices

Differences between html and htl.html by @tophtucker

Crossfilter input by @gampleman

Give a user a persistent personal key for a notebook by @tophtucker

Flight Information Regions by @xoolive

Plot Animation by @analyzer2004

Data wrangling

This notebook collects anonymous usage metrics through Plausible Analytics. Notebooks are monitored for errors using sentry.io. The notebook is saved to Github with backup-to-github.