Introduction

Vitessce is a visual integration tool for exploration of spatial single cell experiments. Its modular design is optimized for scalable, linked visualizations that support the spatial and non-spatial representation of tissue-, cell- and molecule-level data. Vitessce integrates the Viv library to visualize highly multiplexed, high-resolution, high-bit depth image data directly from OME-TIFF files and Bio-Formats-compatible Zarr stores.

Platforms#

Vitessce can be used in JavaScript, Python, or R.

Web application#

Vitessce can be used as a standalone web application on the App page of this website, where you will find a text editor for configing Vitessce with JSON or JavaScript syntax.

Embedded component#

Vitessce can be used as a React component embedded in another web application. For example, the HuBMAP Data Portal currently embeds Vitessce for visualization of HuBMAP datasets. Visit our React Component documentation pages to learn more about using the Vitessce component.

Python Jupyter widget#

We have developed the vitessce Python package for using Vitessce in Python environments. The package contains a Python object-oriented API for creating Vitessce configurations (which can be exported to a JSON format). Vitessce can be used as an ipywidget in Jupyter Notebook and JupyterLab, including in the cloud on Binder.

The Python package also contains helpers which facilitate visualizing data stored in common Python single-cell formats with Vitessce.

R htmlwidget#

We have developed the vitessce R package for using Vitessce in R environments, including RStudio and Shiny apps. The package contains an R object-oriented API for creating Vitessce configurations (which can be exported to a JSON format).

The R package also contains helpers which facilitate visualizing data stored in common R single-cell formats with Vitessce.

Architecture#

The diagram below highlights how Vitessce is composed of a top-level <Vitessce/> React component which encapsulates several individual visualization or controller components such as <Scatterplot/> and <Spatial/>.

Architecture diagram

Configuration#

When using the top-level <Vitessce/> component (or the Python/R widgets), a JSON-based configuration termed the "view config" defines how data is retrieved, which visualization components are rendered, and how different components are coordinated. To simplify the configuration process, we also provide object-oriented APIs for generating view configs in JavaScript, Python, and R.

Integrations#

Vitessce is being used in the following projects:

Contributors#