Download
Observable Plot is a free, open-source JavaScript library to help you quickly visualize tabular data. It has a concise and (hopefully) memorable API to foster fluency — and plenty of examples to learn from and copy-paste. In the spirit of show don’t tell, below is a scatterplot of the height and weight of Olympic athletes (sourced from Matt Riggott), constructed using a dot mark. We assign columns of data (such as weight) to visual properties (such as the dot’s x), and Plot infers the rest. You can configure much more, if needed, but Plot’s goal is to help you get a meaningful visualization quickly. Plot employs a layered grammar of graphics inspired by Vega-Lite, ggplot2, Wilkinson’s Grammar of Graphics, and Bertin’s Semiology of Graphics. Plot rejects a chart typology in favor of marks, scales, and transforms. Plot can be readily extended in JavaScript, whether to define a channel, a transform, or even a custom mark.
Features
- In Observable notebooks, Plot and D3 are available by default as part of the standard library
- Plot can then be imported as a namespace:
- Plot is also available as a UMD bundle for legacy browsers
- The marks option specifies an array of marks to render
- On Observable, the width can be set to the standard width to make responsive plots
- The default margins depend on the plot’s axes
Project Samples
