### Install Development Dependencies

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/README.md

Installs necessary development, documentation, and all extra packages for the Vitessce Python package using `uv sync`. This command is typically run from the `docs/notebooks` directory.

```sh
cd docs/notebooks
uv sync --extra dev --extra docs --extra all
```

--------------------------------

### Run Jupyter Lab

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/README.md

Starts the Jupyter Lab environment, allowing users to interact with and run the example notebooks. This command is executed after dependencies are installed.

```sh
uv run jupyter lab
```

--------------------------------

### Setup Vitessce Demos Environment

Source: https://github.com/vitessce/vitessce-python/blob/main/demos/README.md

Installs the necessary dependencies and activates the Python environment for running Vitessce demo dataset processing scripts. Requires navigating to the 'demos' directory.

```sh
cd demos
conda env create -f environment.yml
conda activate vitessce-python-demos
pip install -e "..[dev]"
```

--------------------------------

### Import Example Configuration

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_from_dict.ipynb

Imports a pre-defined Vitessce configuration dictionary named 'dries' from a local 'example_configs.py' file. This configuration specifies how Vitessce components, datasets, and files should be visualized.

```python
from example_configs import dries as dries_config
```

--------------------------------

### Install Vitessce and SpatialQuery Dependencies

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_plugin_spatial-query.ipynb

Installs necessary Python packages for Vitessce and the SpatialQuery plugin, including specific versions and a Git repository for the plugin.

```python
#!pip install "vitessce[all]==3.3.0" esbuild_py anndata
!pip install "mlxtend~=0.23.0"
#!pip install -i "https://test.pypi.org/simple/" SpatialQuery
!pip install "SpatialQuery @ git+https://github.com/ShaokunAn/Spatial-Query@main"
```

--------------------------------

### Import Utility Dependencies

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Imports essential Python modules for file manipulation, network requests, and data handling, which are necessary for downloading and processing example datasets.

```python
import os
from os.path import join, isfile, isdir
from urllib.request import urlretrieve
import zipfile
import json
```

--------------------------------

### Serve Vitessce Files Locally

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/data_export_files.ipynb

Provides instructions on how to serve the exported Vitessce files using a static web server. It recommends `http-server` and shows the command to navigate to the output directory (`test`) and start the server with CORS enabled on port 3000.

```sh
cd test
http-server ./ --cors -p 3000
```

--------------------------------

### Install Vitessce Package

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_on_colab.ipynb

Installs the vitessce Python package with all optional dependencies using pip. This is the first step for setting up Vitessce in a Python environment like Google Colab.

```python
!pip install vitessce[all]
```

--------------------------------

### Render Vitessce Widget with Plugins

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_plugin_custom.ipynb

Renders the configured Vitessce widget, incorporating any defined plugins. This step finalizes the visualization setup by creating the widget instance and making it available for display or further interaction.

```python
vw = vc.widget(plugins=[ChatPlugin()])
vw
```

--------------------------------

### Define Data File URLs

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Specifies the URLs for downloading various example datasets, including SpatialData in Zarr format, AnnData in Zarr and H5AD formats, and OME-TIFF/OME-Zarr representations.

```python
base_url = "https://storage.googleapis.com/vitessce-demo-data/spatialdata-may-2025"

zip_filepath = f"{base_url}/mouse_liver.spatialdata.zarr.zip"
spatialdata_filepath = f"{base_url}/mouse_liver.spatialdata.zarr"
adata_zarr_filepath = f"{base_url}/mouse_liver.anndata.zarr"
adata_h5ad_filepath = f"{base_url}/mouse_liver.h5ad"
ref_spec_json_filepath = f"{base_url}/mouse_liver.h5ad.ref.json"
ome_tiff_filepath = f"{base_url}/mouse_liver.ome.tif"
offsets_json_filepath = f"{base_url}/mouse_liver.ome.tif.offsets.json"
ome_zarr_filepath = f"{base_url}/mouse_liver.ome.zarr"
labels_ome_zarr_filepath = f"{base_url}/mouse_liver.labels.ome.zarr"
```

--------------------------------

### Configure H5AD-based AnnData Visualization

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver.ipynb

Configures Vitessce to visualize AnnData stored in H5AD format, requiring a reference specification file. It sets up data, views, and links similar to the Zarr example.

```python
from vitessce import VitessceConfig, AnnDataWrapper
import vitessce.api as vt

# Assuming adata_h5ad_filepath and ref_spec_json_filepath are defined
# vc = VitessceConfig(schema_version="1.0.17", name="AnnData (h5ad)")
# wrapper = AnnDataWrapper(
#     adata_path=adata_h5ad_filepath,
#     ref_path=ref_spec_json_filepath,
#     obs_feature_matrix_path="X",
#     obs_set_paths=["obs/annotation"],
#     obs_set_names=["Annotation"],
#     coordination_values={
#       "obsType": "cell"
#     }
# )
# dataset = vc.add_dataset(name='Mouse Liver').add_object(wrapper)
# heatmap = vc.add_view(vt.HEATMAP, dataset=dataset)
# feature_list = vc.add_view(vt.FEATURE_LIST, dataset=dataset)
# obs_sets = vc.add_view(vt.OBS_SETS, dataset=dataset)
# violin_plots = vc.add_view("obsSetFeatureValueDistribution", dataset=dataset)
# vc.link_views([heatmap, feature_list, obs_sets], ['obsType', 'featureValueColormapRange'], ['cell', [0, 0.01]])
# vc.layout((heatmap / violin_plots) | (feature_list / obs_sets));
# vc.widget()
```

--------------------------------

### Development Installation

Source: https://github.com/vitessce/vitessce-python/blob/main/README.md

Clones the vitessce-python repository from GitHub and installs project dependencies for development using the uv package manager. This setup is for contributors or those needing the latest code.

```sh
git clone https://github.com/vitessce/vitessce-python.git
cd vitessce-python
uv sync --extra dev --extra docs --extra all
```

--------------------------------

### Install vitessce-python

Source: https://github.com/vitessce/vitessce-python/blob/main/README.md

Installs the vitessce-python package with all optional dependencies using pip. This command ensures all necessary components for full functionality are included.

```sh
pip install 'vitessce[all]'
```

--------------------------------

### Download PBMC3k Dataset

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_pbmc.ipynb

Downloads the `pbmc3k_final.h5ad` dataset from a specified URL if it is not already present in the 'data' directory. It ensures the 'data' directory exists before downloading.

```python
adata_filepath = join("data", "pbmc3k_final.h5ad")
if not isfile(adata_filepath):
    os.makedirs("data", exist_ok=True)
    urlretrieve('https://seurat.nygenome.org/pbmc3k_final.h5ad', adata_filepath)
```

--------------------------------

### Instantiate VitessceConfig

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_brain.ipynb

Creates an instance of the `VitessceConfig` class, specifying the schema version and providing a name and description for the visualization configuration.

```python
vc = VitessceConfig(schema_version="1.0.15", name='Habib et al', description='COVID-19 Healthy Donor Brain')
```

--------------------------------

### Install Vitessce Python Package

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/index.rst

Installs the vitessce Python package from PyPI with all optional dependencies. Requires Python 3.9 or greater.

```bash
pip install vitessce[all]
```

--------------------------------

### Get Widget Instance

Source: https://github.com/vitessce/vitessce-python/blob/main/README.md

Retrieves the current Vitessce widget instance. This is a common step before interacting with or inspecting the widget's properties.

```python
vw = vc.widget()
vw
```

--------------------------------

### Configure Vitessce Widget

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_merfish.ipynb

Sets up the Vitessce configuration, adds datasets with SpatialData wrappers for images and labels, defines views (spatial and layer controller), links them by coordination scopes, and defines the layout.

```python
vc = VitessceConfig(
    schema_version="1.0.17",
    name='SpatialData with MERFISH data',
)
# Add data to the configuration:

dataset = vc.add_dataset(name='MERFISH').add_object(SpatialDataWrapper(
    sdata_url=sdata_url,
    # The following paths are relative to the root of the SpatialData zarr store on-disk.
    image_path="images/stains",
    coordinate_system="global",
    coordination_values={
        "fileUid": "stains"
    }
)).add_object(SpatialDataWrapper(
    sdata_url=sdata_url,
    # The following paths are relative to the root of the SpatialData zarr store on-disk.
    labels_path="labels/dapi_labels",
    coordinate_system="global",
    coordination_values={
        "obsType": "nucleus",
        "fileUid": "dapi"
    }
)).add_object(SpatialDataWrapper(
    sdata_url=sdata_url,
    # The following paths are relative to the root of the SpatialData zarr store on-disk.
    labels_path="labels/membrane_labels",
    coordinate_system="global",
    coordination_values={
        "obsType": "cell",
        "fileUid": "membrane"
    }
))

# Add views (visualizations) to the configuration:
spatial = vc.add_view("spatialBeta", dataset=dataset)
layer_controller = vc.add_view("layerControllerBeta", dataset=dataset)

vc.link_views_by_dict([spatial, layer_controller], {
    'imageLayer': CL([
        {
        "fileUid": "stains",
        'photometricInterpretation': 'BlackIsZero',
        'spatialLayerOpacity': 1.0,
        'spatialLayerVisible': True,
        'imageChannel': CL([
            {
                'spatialChannelVisible': True,
                "spatialTargetC": 0, # DAPI, Nucleus
                "spatialChannelColor": [0, 0, 255],
                "spatialChannelOpacity": 1.0
            },
            {
                'spatialChannelVisible': True,
                "spatialTargetC": 1, # Membrane, Cell
                "spatialChannelColor": [255, 255, 255],
                "spatialChannelOpacity": 1.0
            }
        ])
    }]),
}, scope_prefix=get_initial_coordination_scope_prefix("A", "image"))

vc.link_views_by_dict([spatial, layer_controller], {
    'segmentationLayer': CL([
        {
        "fileUid": "membrane",
        'spatialLayerOpacity': 1.0,
        'spatialLayerVisible': True,
        'segmentationChannel': CL([
            {
            'spatialChannelVisible': True,
            'obsType': 'cell',
            "spatialChannelColor": [200, 200, 200],
            "obsColorEncoding": "spatialChannelColor",
            
            }]),
        }, {
        "fileUid": "dapi",
        'spatialLayerOpacity': 1.0,
        'spatialLayerVisible': True,
        'segmentationChannel': CL([
            {
            'spatialChannelVisible': True,
            'obsType': 'nucleus',
            "spatialChannelColor": [255, 255, 255],
            "obsColorEncoding": "spatialChannelColor",
            
            }]),
        
        }]),

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
```

--------------------------------

### Widget Usage with Remote Jupyter

Source: https://github.com/vitessce/vitessce-python/blob/main/README.md

Demonstrates how to launch the Vitessce widget when Jupyter is running on a remote machine. The `proxy=True` argument is crucial for correct rendering in such setups.

```python
vw = vc.widget(proxy=True)
vw
```

--------------------------------

### Import Vitessce Libraries

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_imaging.ipynb

Imports necessary classes and functions from the vitessce library for creating visualizations. Includes wrappers for OmeTiff and MultiImage data, and coordination types.

```python
from vitessce import (
    VitessceConfig,
    Component as cm,
    CoordinationType as ct,
    OmeTiffWrapper,
    MultiImageWrapper,
)
from os.path import join
```

--------------------------------

### Configure Spatial Data URL

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_kpmp_vis.ipynb

Sets the URL for the spatial data to be loaded into Vitessce. This example uses a publicly accessible Zarr archive from Google Cloud Storage.

```python
sdata_url = "https://storage.googleapis.com/vitessce-demo-data/kpmp-f2f-march-2023/S-1905-017737/sdata.zarr"
```

--------------------------------

### Instantiate VitessceConfig

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_brain_with_base_dir.ipynb

Creates an instance of VitessceConfig, specifying the schema version, a name for the visualization, and the base directory for local data paths. This object will be used to define the visualization layout and data sources.

```python
vc = VitessceConfig(schema_version="1.0.15", name='Habib et al', base_dir=BASE_DIR)
```

--------------------------------

### Launch Vitessce Web Application

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/web_app_brain.ipynb

Serves the configured Vitessce visualization locally and automatically opens it in a web browser. The `web_app()` method generates the necessary JSON configuration and hosts it, providing a direct link to the interactive application.

```python
vc.web_app()
```

--------------------------------

### Initialize Vitessce Configuration

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_kpmp_vis.ipynb

Creates a `VitessceConfig` instance, which serves as the primary object for building the Vitessce visualization configuration. It specifies the schema version and assigns a name to the configuration.

```python
# Create a VitessceConfig instance.
vc = VitessceConfig(schema_version="1.0.17", name="SpatialData")
```

--------------------------------

### Extract and Save AnnData to Zarr

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver.ipynb

Shows how to extract an AnnData object from a SpatialData object and save it to the Zarr format. It includes an example of specifying chunk shapes for performance optimization.

```python
from anndata import read_zarr, AnnData

# Assuming spatialdata_filepath and adata_zarr_filepath are defined
# Assuming VAR_CHUNK_SIZE is defined
# sdata = read_zarr(spatialdata_filepath)
# adata = sdata.tables['table']
# adata.write_zarr(adata_zarr_filepath, chunks=(adata.shape[0], VAR_CHUNK_SIZE))
```

--------------------------------

### Import Dependencies

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/data_export_s3.ipynb

Imports necessary Python libraries for data handling, processing, and Vitessce configuration. Includes modules from `os`, `boto3`, `json`, `urllib`, `anndata`, `scanpy`, and `vitessce`.

```python
import os
import boto3
import json
from urllib.parse import quote_plus
from os.path import join, isfile, isdir
from urllib.request import urlretrieve
from anndata import read_h5ad
import scanpy as sc

from vitessce import (
    VitessceWidget,
    VitessceConfig,
    Component as cm,
    CoordinationType as ct,
    AnnDataWrapper,
)
from vitessce.data_utils import (
    optimize_adata,
    VAR_CHUNK_SIZE,
)
```

--------------------------------

### Display Vitessce Widget for Zarr AnnData

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Renders the configured Vitessce widget for visualizing Zarr-based AnnData data. This command displays the interactive visualization created by the preceding VitessceConfig setup.

```python
vc.widget()
```

--------------------------------

### Python: Link Views with Layer Configurations

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_kpmp_vis.ipynb

Illustrates how to link different views (e.g., spatial, layer controller) and configure their layers using `vc.link_views_by_dict`. This includes setting properties for image layers and detailed configurations for segmentation layers.

```python
import vitessce as vc
from vitessce.api import CL # Assuming CL is a constructor or helper

# Assuming 'spatial', 'layer_controller', 'get_initial_coordination_scope_prefix' are defined elsewhere

# Link views and configure image layer
vc.link_views_by_dict([spatial, layer_controller], {
    "imageLayer": CL([
        {
            "spatialLayerOpacity": 0.1,
            "photometricInterpretation": "RGB",
        },
    ])
}, meta=True, scope_prefix=get_initial_coordination_scope_prefix("A", "image"))

# Link views and configure segmentation layers
vc.link_views_by_dict([spatial, layer_controller], {
    "segmentationLayer": CL([
        {
            "fileUid": "labels_tubules",
            "segmentationChannel": CL([
                {
                    "spatialTargetC": 0,
                    "obsType": t_ot_scope, # From previous coordination setup
                    "featureType": ft_scope, # From previous coordination setup
                    "featureValueType": fvt_scope, # From previous coordination setup
                    "featureSelection": t_fs_scope, # From previous coordination setup
                    "spatialChannelVisible": False,
                    "spatialChannelColor": [73, 155, 119],
                    "spatialChannelOpacity": 0.5,
                    "obsColorEncoding": t_oce_scope, # From previous coordination setup
                    "featureValueColormapRange": [0, 1],
                    "featureAggregationStrategy": "first",
                    "spatialSegmentationFilled": True,
                    "obsHighlight": None,
                }
            ])
        },
        {
            "fileUid": "labels_arteries_arterioles",
            "segmentationChannel": CL([
                {
                    "spatialTargetC": 0,
                    "obsType": "Artery",
                    "featureType": ft_scope, # From previous coordination setup
                    "featureValueType": fvt_scope, # From previous coordination setup
                    "spatialChannelVisible": False,
                    "spatialChannelColor": [237, 226, 107],
                    "spatialChannelOpacity": 0.5,
                    "obsColorEncoding": "spatialChannelColor",
                    "featureValueColormapRange": [0, 1],
                    "featureAggregationStrategy": "first",
                    "spatialSegmentationFilled": True,
                    "obsHighlight": None,
                }
            ])
        },
        {
            "fileUid": "labels_cortical_interstitia",
            "segmentationChannel": CL([
                {
                    "spatialTargetC": 0,
                    "obsType": "Cortical Interstitium",
                    "featureType": ft_scope, # From previous coordination setup
                    "featureValueType": fvt_scope, # From previous coordination setup
                    "spatialChannelVisible": False,
                    "spatialChannelColor": [255, 255, 255],
                    "spatialChannelOpacity": 0.5,
                    "obsColorEncoding": "spatialChannelColor",
                    "featureValueColormapRange": [0, 1],
                    "featureAggregationStrategy": "first",
                    "spatialSegmentationFilled": True,
                    "obsHighlight": None,
                }
            ])
        },
        {
            "fileUid": "labels_globally_sclerotic_glomeruli",
            "segmentationChannel": CL([
                {
                    "spatialTargetC": 0,
                    "obsType": gsg_ot_scope, # From previous coordination setup
                    "featureType": ft_scope, # From previous coordination setup
                    "featureValueType": fvt_scope, # From previous coordination setup
                    "featureSelection": gsg_fs_scope, # From previous coordination setup
                    "spatialChannelVisible": False,
                    "spatialChannelColor": [52, 113, 171],
                    "spatialChannelOpacity": 0.5,
                    "obsColorEncoding": gsg_oce_scope, # From previous coordination setup
                    "featureValueColormapRange": gsg_fvcr_scope, # From previous coordination setup
                    "featureAggregationStrategy": "first",
                    "spatialSegmentationFilled": True,
                    "obsHighlight": None,
                }
            ])
        },
        {
            "fileUid": "labels_non_globally_sclerotic_glomeruli",
            "segmentationChannel": CL([
                {
                    "spatialTargetC": 0,
                    "obsType": ngsg_ot_scope, # From previous coordination setup
                    "featureType": ft_scope, # From previous coordination setup
                    "featureValueType": fvt_scope, # From previous coordination setup
                    "featureSelection": ngsg_fs_scope, # From previous coordination setup
                    "spatialChannelVisible": False,
                    "spatialChannelColor": [114, 179, 226],
                    "spatialChannelOpacity": 0.5,
                    "obsColorEncoding": ngsg_oce_scope # From previous coordination setup
                    // ... potentially more properties for this channel
                }
            ])
        }
        // ... potentially more segmentation channels
    ])
})
```

--------------------------------

### Uninstall Vitessce Jupyter Extension

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/README.md

Uninstalls the `vitessce-jupyter` lab extension. This is a troubleshooting step recommended if you previously used Vitessce v1 and are encountering conflicts with the v2 widget JavaScript code.

```sh
jupyter labextension uninstall vitessce-jupyter
```

--------------------------------

### Import Vitessce Libraries

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_plugin_demo.ipynb

Imports essential components from the vitessce library, including configuration classes, component definitions, coordination types, and image wrappers. These are necessary for building and displaying Vitessce visualizations.

```python
from vitessce import (
    VitessceConfig,
    Component as cm,
    CoordinationType as ct,
    OmeTiffWrapper,
    MultiImageWrapper,
)
from os.path import join
```

--------------------------------

### Configure Spatial and Layer Controller Views

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Demonstrates adding spatial and layer controller views, linking them with image and segmentation data using file UIDs, and defining a layout. It shows how to configure image channels with photometric interpretation and windowing, and segmentation channels with color and stroke properties.

```python
import vitessce as vc
from vitessce.data import CL
from vitessce.utils import get_initial_coordination_scope_prefix

# Assuming 'dataset' is already defined and loaded
# spatial = vc.add_view("spatialBeta", dataset=dataset)
# layer_controller = vc.add_view("layerControllerBeta", dataset=dataset)

# vc.link_views_by_dict([spatial, layer_controller], {
#     'imageLayer': CL([
#         {
#             'fileUid': 'image',
#             'photometricInterpretation': 'BlackIsZero',
#             'imageChannel': CL([
#                 {
#                     'spatialTargetC': 0,
#                     'spatialChannelColor': [255, 255, 255],
#                     'spatialChannelWindow': [0, 4000]
#                 }
#             ])
#         }]
#     )
# }, scope_prefix=get_initial_coordination_scope_prefix("A", "image"))

# vc.link_views_by_dict([spatial, layer_controller], {
#     'segmentationLayer': CL([
#         {
#             'fileUid': 'segmentations',
#             'segmentationChannel': CL([
#                 {
#                     'obsColorEncoding': 'spatialChannelColor',
#                     'spatialChannelColor': [0, 255, 0],
#                     'spatialChannelOpacity': 0.75,
#                     'spatialSegmentationFilled': False,
#                     'spatialSegmentationStrokeWidth': 0.25
#                 }
#             ])
#         }]
#     )
# }, scope_prefix=get_initial_coordination_scope_prefix("A", "obsSegmentations"))

# vc.link_views([spatial, layer_controller, feature_list, obs_sets], ['obsType'], ['cell']) # Assuming feature_list and obs_sets are defined

# vc.layout(hconcat(spatial, layer_controller, split=(2, 1)))
```

--------------------------------

### Display Vitessce Widget for H5AD AnnData

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Renders the configured Vitessce widget for visualizing H5AD-based AnnData data. This command displays the interactive visualization created by the preceding VitessceConfig setup, which includes the necessary reference specification.

```python
vc.widget()
```

--------------------------------

### Configure Vitessce Layout and Coordination

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_plugin_spatial-query.ipynb

Sets up the Vitessce configuration, including adding datasets, defining views (spatial, layer controller, sets, feature list, spatial query), and linking coordination values between views using the `SpatialQueryPlugin`.

```python
vc = VitessceConfig(schema_version="1.0.16", name="Spatial-Query")
dataset = vc.add_dataset("Query results").add_object(AnnDataWrapper(
    adata_path=zarr_path,
    obs_feature_matrix_path="X",
    obs_set_paths=["obs/predicted.ASCT.celltype"],
    obs_set_names=["Cell Type"],
    obs_spots_path="obsm/X_spatial",
    feature_labels_path="var/hugo_symbol",
    coordination_values={
        "featureLabelsType": "Gene symbol",
    }
))

spatial_view = vc.add_view("spatialBeta", dataset=dataset)
pc_view = vc.add_view("layerControllerBeta", dataset=dataset)
sets_view = vc.add_view("obsSets", dataset=dataset)
features_view = vc.add_view("featureList", dataset=dataset)
sq_view = vc.add_view("spatialQuery", dataset=dataset)

obs_set_selection_scope, = vc.add_coordination("obsSetSelection",)
obs_set_selection_scope.set_value(None)

sets_view.use_coordination(obs_set_selection_scope)
sq_view.use_coordination(obs_set_selection_scope)
spatial_view.use_coordination(obs_set_selection_scope)
features_view.use_coordination(obs_set_selection_scope)

vc.link_views([spatial_view, npc_view, sets_view, features_view],
    ["additionalObsSets", "obsSetColor"],
    [plugin.additional_obs_sets, plugin.obs_set_color]
)
vc.link_views_by_dict([spatial_view, npc_view], {
    "spotLayer": CL([
        {
            "obsType": "cell",
            "spatialSpotRadius": 15,
        },
    ])
})

vc.layout((spatial_view | (npc_view / features_view)) / (sets_view | sq_view));
```

--------------------------------

### Define File Paths for Mouse Liver Dataset

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver.ipynb

Defines the file paths for the downloaded mouse liver dataset, including Zarr, H5AD, and TIFF formats. These paths are used for subsequent data processing and visualization setup.

```Python
data_dir = "data"
zip_filepath = join(data_dir, "mouse_liver.spatialdata.zarr.zip")
spatialdata_filepath = join(data_dir, "mouse_liver.spatialdata.zarr")
adata_zarr_filepath = join(data_dir, "mouse_liver.anndata.zarr")
adata_h5ad_filepath = join(data_dir, "mouse_liver.h5ad")
ref_spec_json_filepath = join(data_dir, "mouse_liver.h5ad.ref.json")
ome_tiff_filepath = join(data_dir, "mouse_liver.ome.tif")
offsets_json_filepath = join(data_dir, "mouse_liver.ome.tif.offsets.json")
ome_zarr_filepath = join(data_dir, "mouse_liver.ome.zarr")
labels_ome_zarr_filepath = join(data_dir, "mouse_liver.labels.ome.zarr")
```

--------------------------------

### Create Vitessce Configuration

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/data_export_s3.ipynb

Initializes a VitessceConfig object and adds datasets and views. This code defines the layout and components (scatterplot, cell sets, heatmap) for the interactive visualization.

```python
vc = VitessceConfig(schema_version="1.0.15", name='Habib et al', description='COVID-19 Healthy Donor Brain')
dataset = vc.add_dataset(name='Brain').add_object(AnnDataWrapper(
        adata_path=zarr_filepath,
        obs_embedding_paths=["obsm/X_umap"],
        obs_embedding_names=["UMAP"],
        obs_set_paths=["obs/CellType"],
        obs_set_names=["Cell Type"],
        obs_feature_matrix_path="X",
        feature_filter_path="var/top_highly_variable"
))
scatterplot = vc.add_view(cm.SCATTERPLOT, dataset=dataset, mapping="UMAP")
cell_sets = vc.add_view(cm.OBS_SETS, dataset=dataset)
genes = vc.add_view(cm.FEATURE_LIST, dataset=dataset)
heatmap = vc.add_view(cm.HEATMAP, dataset=dataset)
vc.layout((scatterplot | (cell_sets / genes)) / heatmap);
```

--------------------------------

### Serve Demo Data Locally

Source: https://github.com/vitessce/vitessce-python/blob/main/demos/README.md

Starts a local HTTP server to serve demo data files. The `--cors='*'` option enables Cross-Origin Resource Sharing, and `--port 8000` specifies the listening port.

```sh
http-server --cors='*' --port 8000 .
```

--------------------------------

### Configure OME-TIFF Image Visualization

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/spatial_data_mouseliver_remote.ipynb

Demonstrates setting up Vitessce for OME-TIFF data. It includes initializing VitessceConfig, adding data using ImageOmeTiffWrapper with file paths, adding spatial and layer controller views, and linking the image layer with specific channel configurations.

```python
from vitessce.config import VitessceConfig
from vitessce.data import ImageOmeTiffWrapper, CL
from vitessce.utils import get_initial_coordination_scope_prefix

# Assuming ome_tiff_filepath and offsets_json_filepath are defined
# vc = VitessceConfig(schema_version="1.0.17", name="Image and segmentations (ome-tiff)")
# wrapper = ImageOmeTiffWrapper(
#     img_url=ome_tiff_filepath,
#     offsets_url=offsets_json_filepath
# )
# dataset = vc.add_dataset(name='Mouse Liver').add_object(wrapper)

# spatial = vc.add_view("spatialBeta", dataset=dataset)
# layer_controller = vc.add_view("layerControllerBeta", dataset=dataset)

# vc.link_views_by_dict([spatial, layer_controller], {
#     'imageLayer': CL([
#         {
#             'photometricInterpretation': 'BlackIsZero',
#             'imageChannel': CL([
#                 {
#                     'spatialTargetC': 0,
#                     'spatialChannelColor': [255, 255, 255],
#                     'spatialChannelWindow': [0, 4000]
#                 }
#             ])
#         }]
#     )
# }, scope_prefix=get_initial_coordination_scope_prefix("A", "image"))

# vc.layout(hconcat(spatial, layer_controller, split=(2, 1)))
```

--------------------------------

### Download H5AD Data for Visualization

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_brain_h5ad.ipynb

Downloads a sample H5AD file from a provided URL to a local 'data' directory. It checks if the file already exists to avoid redundant downloads. This step prepares the primary data source for visualization.

```python
h5_url = "https://datasets.cellxgene.cziscience.com/84df8fa1-ab53-43c9-a439-95dcb9148265.h5ad"

adata_filepath = join("data", "84df8fa1-ab53-43c9-a439-95dcb9148265.h5ad")
if not isfile(adata_filepath):
    os.makedirs("data", exist_ok=True)
    urlretrieve(h5_url, adata_filepath)
```

--------------------------------

### SSH Port Forwarding and HTTP Server Setup

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/data_options.rst

Demonstrates how to establish SSH port forwarding to access remote files locally and then serve them using `http-server` with CORS enabled. This is useful when the Jupyter process is local but files are remote and accessed via SSH.

```bash
# Replace REMOTE_PORT and LOCAL_PORT below with the desired port numbers.
# Replace my_username and cluster.university.edu.
ssh -L REMOTE_PORT:127.0.0.1:LOCAL_PORT my_username@cluster.university.edu
# Optionally SSH to a particular login node first.
ssh -L REMOTE_PORT:127.0.0.1:REMOTE_PORT login01
# Optionally start an interactive compute session first, but make sure tunneling/port forwarding is enabled.
# Note: this command may be different depending on the cluster and job management system.
srun -t 0-3:00 --pty -p interactive --tunnel REMOTE_PORT:REMOTE_PORT /bin/bash
# cd to some directory with files to serve.
http-server --cors='*' --port REMOTE_PORT .
```

--------------------------------

### Add Visualization Views to VitessceConfig

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/web_app_brain.ipynb

Configures individual visualization components (views) within the Vitessce layout. This example adds a scatterplot, cell sets viewer, gene list, and heatmap, linking them to the previously defined dataset. The `Component` enum (`cm`) is used to specify component types.

```python
scatterplot = vc.add_view(cm.SCATTERPLOT, dataset=dataset, mapping="UMAP")
cell_sets = vc.add_view(cm.OBS_SETS, dataset=dataset)
genes = vc.add_view(cm.FEATURE_LIST, dataset=dataset)
heatmap = vc.add_view(cm.HEATMAP, dataset=dataset)
```

--------------------------------

### Configure Vitessce Data and Layout

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_imaging.ipynb

Configures the Vitessce visualization by adding datasets, wrapping image data using OmeTiffWrapper and MultiImageWrapper, and setting up the layout with spatial, layer controller, and status components. Physical size scaling is enabled for accurate overlay.

```python
vc = VitessceConfig(schema_version="1.0.15", name='Spraggins Multi-Modal', description='PAS + IMS + AF From https://portal.hubmapconsortium.org/browse/collection/6a6efd0c1a2681dc7d2faab8e4ab0bca')
dataset = vc.add_dataset(name='Spraggins').add_object(
    MultiImageWrapper(
        image_wrappers=[
            OmeTiffWrapper(img_url='https://assets.hubmapconsortium.org/f4188a148e4c759092d19369d310883b/ometiff-pyramids/processedMicroscopy/VAN0006-LK-2-85-PAS_images/VAN0006-LK-2-85-PAS_registered.ome.tif?token=', name='PAS'),
            OmeTiffWrapper(img_url='https://assets.hubmapconsortium.org/2130d5f91ce61d7157a42c0497b06de8/ometiff-pyramids/processedMicroscopy/VAN0006-LK-2-85-AF_preIMS_images/VAN0006-LK-2-85-AF_preIMS_registered.ome.tif?token=', name='AF'),
            OmeTiffWrapper(img_url='https://assets.hubmapconsortium.org/be503a021ed910c0918842e318e6efa2/ometiff-pyramids/ometiffs/VAN0006-LK-2-85-IMS_PosMode_multilayer.ome.tif?token=', name='IMS Pos Mode'),
            OmeTiffWrapper(img_url='https://assets.hubmapconsortium.org/ca886a630b2038997a4cfbbf4abfd283/ometiff-pyramids/ometiffs/VAN0006-LK-2-85-IMS_NegMode_multilayer.ome.tif?token=', name='IMS Neg Mode')
        ],
        use_physical_size_scaling=True,
 )
)
spatial = vc.add_view(cm.SPATIAL, dataset=dataset)
status = vc.add_view(cm.STATUS, dataset=dataset)
lc = vc.add_view(cm.LAYER_CONTROLLER, dataset=dataset).set_props(disableChannelsIfRgbDetected=True)
vc.layout(spatial | (lc / status));
```

--------------------------------

### Configure Vitessce View

Source: https://github.com/vitessce/vitessce-python/blob/main/docs/notebooks/widget_pbmc.ipynb

Sets up the Vitessce configuration, adding the AnnData dataset and defining various views like Scatterplot, Obs Sets, Feature List, and Heatmap. It also specifies the layout for these views.

```python
vc = VitessceConfig(schema_version="1.0.15", name='PBMC Reference')
dataset = vc.add_dataset(name='PBMC 3k').add_object(AnnDataWrapper(
    adata_store=zarr_filepath,
    obs_set_paths=["obs/leiden"],
    obs_set_names=["Leiden"],
    obs_embedding_paths=["obsm/X_umap", "obsm/X_pca"],
    obs_embedding_names=["UMAP", "PCA"],
    obs_feature_matrix_path="X"
))

umap = vc.add_view(cm.SCATTERPLOT, dataset=dataset, mapping="UMAP")
pca = vc.add_view(cm.SCATTERPLOT, dataset=dataset, mapping="PCA")
cell_sets = vc.add_view(cm.OBS_SETS, dataset=dataset)
genes = vc.add_view(cm.FEATURE_LIST, dataset=dataset)
heatmap = vc.add_view(cm.HEATMAP, dataset=dataset)

vc.layout((umap / pca) | ((cell_sets | genes) / heatmap));
```