Lattice.js is a JavaScript library for creating coordinated multivariate visualizations for sciences. At its core, Lattice champions a 2D grid-based design approach, which offers an intuitive yet powerful visual solution for rendering multivariate data.

Use case: A scatter plot with histograms

When viewing a scatter plot with a lot of data points, it is often not as easy to get a true sense of the marginal distributions. Using Lattice, we can easily render a scatter plot and the marginal distributions as histograms along both axes.


(Click to view a different data set)

Use case: Daily new positive COVID cases in the US

A small multiple is a special kind of grid-based visualization design, where a series of similar charts are rendered and organized in a grid structure. A small multiple makes it easy to compare across many similar datasets. Here, we use Lattice to render the daily positive COVID cases in the 50 states over time as a series of bar graphs, arranged in a less conventional grid that loosely resembles the US map. The daily positive COVID data are obtained from the COVID Tracking Project .


Use case: iCoMut——a visualization for cancer genomes

CoMut plot, introduced by Nicolas Stransky , is often seen in cancer research publications as a visual summary of genetic variations/mutations in cancer cohorts. The plot itself is essentially a lattice of varous chart types aligned and interconnected via a common variable (X or Y axis). The central panel of a CoMut plot render mutation analyses and metadata of the patients in various charts vertically aligned with a shared X axis (i.e. patients). iCoMut, in production on TumorPortal and FireBrowse , aims to further transform the static image into an interactive data exporer providing greater access to the research community. The cohort data shown below are from FireBrowse.


Basic chart types

Lattice offers many basic chart types that can be directly used without using a lattice. Here is the list of currently available chart types, and each chart below is rendering a random set of data. This list is by no means comprehensive since we are primarily focusing on the chart types that could be used to create grid-based visualizations. However, more new types of charts will be added as we continue to develop new visualizations with Lattice.

bar plot

column plot

stacked bar plot

stacked column plot

categorical heatmap

heatmap

scatter plot

area plot

barcode plot