CanvasXpress Recipes

Interactive network graphs in Python with canvasxpress

Isaac Neuhaus — Fri, 30 Oct 2026 04:00:00 GMT

A network graph shows relationships: nodes connected by edges, laid out so connected things sit near each other. The usual Python reach is networkx + matplotlib (static) or pyvis. Here we build one with canvasxpress — draggable, hover-labelled, force-directed, and reproducible from a single portable spec.

Install

pip install canvasxpress

The data shape

canvasXpress builds a network from two lists: nodes (id, name, group) and edges (id1, id2, value). Swap this simulated three-community graph for your own.

import random
random.seed(1)

groups = ["Alpha", "Beta", "Gamma"]
nodes, by_group = [], {g: [] for g in groups}
k = 0
for g in groups:
    for i in range(7):
        nid = f"n{k}"; nodes.append({"id": nid, "name": f"{g}{i+1}", "group": g})
        by_group[g].append(nid); k += 1

edges = []
for g in groups:                                   # dense within a community
    m = by_group[g]
    for i in range(len(m)):
        for j in range(i + 1, len(m)):
            if random.random() < 0.5:
                edges.append({"id1": m[i], "id2": m[j], "value": random.randint(1, 5)})
for _ in range(6):                                 # a few cross-community links
    g1, g2 = random.sample(groups, 2)
    edges.append({"id1": random.choice(by_group[g1]), "id2": random.choice(by_group[g2]), "value": 1})

The plot

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {"nodes": nodes, "edges": edges}
config = {
    "graphType": "Network",
    "networkLayoutType": "forceDirected",
    "colorNodeBy": "group",
    "nodeSize": 25,
    "showAnimation": True,
    "title": "A small community network",
}

cx = CanvasXpress(render_to="network", data=data, config=config, width=650, height=500)
for part in CXNoteBook(cx).render():
    display(part)

Drag any node and the layout settles around it; hover to read the label. The three communities separate on their own because within-group edges outnumber the cross-group ones.

Why “reproducible”

The nodes, edges and config are the figure — one portable JSON spec that renders the identical network from R or JavaScript, and can be validated and re-rendered later.

Sankey / alluvial diagrams in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

An interactive NGS sequencing-QC dashboard in Python with canvasxpress

Isaac Neuhaus — Fri, 30 Oct 2026 04:00:00 GMT

After a sequencing run you get a QC table — one row per sample, a dozen metrics — and you need to answer three questions fast: which samples fail, is a whole batch off, and are the failures correlated? A single scatter can’t do it; you want several views that talk to each other — select a suspicious sample in one and see it light up in the rest. In Python that usually means Dash or Streamlit (a server, callbacks). canvasXpress does it client-side: give every panel the same broadcast group and a selection broadcasts to all of them. Here we build a real QC dashboard for 96 RNA/exome samples.

Install

pip install canvasxpress

The QC table

96 samples with mapping rate, duplication, Q30, GC, insert size and contamination (VerifyBamID freemix), plus lane / batch / library annotations. (Download: ngs-qc.csv.)

import csv, statistics as st

rows = list(csv.DictReader(open("ngs-qc.csv")))
metrics = ["total_reads", "pct_mapped", "pct_duplication", "pct_q30",
           "gc_content", "insert_size", "contamination_freemix"]

samples = [r["sample"] for r in rows]
annot   = {"Lane": [r["lane"] for r in rows], "Batch": [r["batch"] for r in rows],
           "Library": [r["library"] for r in rows]}
raw = {m: [float(r[m]) for r in rows] for m in metrics}
print(len(samples), "samples,", len(metrics), "metrics")

96 samples, 7 metrics

Overview — a clustered QC heatmap

Z-score each metric and cluster: outlier samples and any batch/library structure jump out at a glance. This is the “is anything wrong, and where” view. Here the matrix is metrics × samples.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

z = {m: [(v - st.mean(raw[m])) / (st.pstdev(raw[m]) or 1) for v in raw[m]] for m in metrics}
hm = {"y": {"vars": metrics, "smps": samples, "data": [[round(x, 2) for x in z[m]] for m in metrics]},
      "x": {"Batch": annot["Batch"], "Library": annot["Library"]}}

cx = CanvasXpress(render_to="qcHeat", data=hm, width=820, height=420, config={
    "graphType": "Heatmap", "samplesClustered": True, "variablesClustered": True,
    "colorSpectrum": ["navy", "white", "firebrick3"],
    "title": "QC metrics (z-scored) — 96 samples clustered"})
for part in CXNoteBook(cx).render():
    display(part)

The linked triage dashboard

Four panels over the same samples, all sharing broadcastGroup: "qc". The sample is the unit, so each sample is a point and its lane/batch/library live in the per-sample annotation z. Select points in any panel and the same samples re-mark everywhere.

# Sample-centric: vars = samples (points), smps = metrics (axes), z = per-sample annotations.
data = {"y": {"vars": samples, "smps": metrics, "data": [[raw[m][i] for m in metrics] for i in range(len(samples))]},
        "z": annot}

def panel(cfg, cid, w=640, h=360):
    cfg = {**cfg, "broadcast": True, "broadcastGroup": "qc"}
    cx = CanvasXpress(render_to=cid, data=data, config=cfg, width=w, height=h)
    for part in CXNoteBook(cx).render():
        display(part)

1 — Mapping rate vs duplication (the triage plot)

Bubble size is depth; failing libraries fall to the bottom-right. Lasso them here.

panel({"graphType": "Scatter2D", "xAxis": ["pct_duplication"], "yAxis": ["pct_mapped"],
       "colorBy": "Batch", "sizeBy": "total_reads",
       "title": "Mapping rate vs duplication — select the bottom-right"}, "qcMap")

2 — Contamination vs mapping

panel({"graphType": "Scatter2D", "xAxis": ["pct_mapped"], "yAxis": ["contamination_freemix"],
       "colorBy": "Batch", "title": "Contamination (freemix) vs mapping rate"}, "qcContam")

3 — Q30 vs GC, by library prep

panel({"graphType": "Scatter2D", "xAxis": ["gc_content"], "yAxis": ["pct_q30"],
       "colorBy": "Library", "title": "Q30 vs GC content, coloured by library"}, "qcQ30")

4 — Sequencing depth per sample

panel({"graphType": "Bar", "graphOrientation": "vertical", "xAxis": ["total_reads"],
       "colorBy": "Batch", "title": "Total reads per sample (flag the short ones)"}, "qcReads", w=820, h=300)

Lasso the bad cluster in panel 1 and panels 2–4 immediately restrict to those samples — you can read their contamination, library and depth without a single callback. The “wiring” is one shared group id.

Why “reproducible”

Each panel is a portable data + config spec; the cross-filter is just a shared broadcastGroup. The same specs reproduce the dashboard from R or JavaScript, against the same ngs-qc.csv.

Interactive network graphs in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Genome browser tracks in Python with canvasxpress

Isaac Neuhaus — Fri, 30 Oct 2026 04:00:00 GMT

A genome browser view stacks tracks that share one coordinate axis: coverage, gene models, variants. In Python this usually means pyGenomeTracks or a static matplotlib figure. Here we build an interactive, zoomable view with canvasxpress — from one portable spec.

Install

pip install canvasxpress

The data shape

A Genome figure is a list of tracks that share one coordinate axis — each with a type. Real browser views stack several: here we build four — gene models (box, multi-exon, connected), coverage across three tissues (bar), an expression heatmap (heatmap), and variant markers (triangle).

import random
random.seed(3)

# Gene models: each gene is a set of exon [start, end] intervals, drawn connected.
genes = []
for j in range(4):
    start = 40 + j * 120
    exons = [[start + k * 30, start + k * 30 + 18] for k in range(random.randint(2, 4))]
    genes.append({"id": f"GENE{j+1}", "dir": "right" if j % 2 == 0 else "left",
                  "fill": "rgb(70,130,220)", "outline": "rgb(0,0,0)", "data": exons})

# Coverage and expression: one entry per binned position, three tissues each.
offsets  = [50 + i * 22 for i in range(22)]
coverage = [{"id": f"p{i}", "offset": o,
             "data": [random.randint(8, 45), random.randint(8, 45), random.randint(8, 45)]}
            for i, o in enumerate(offsets)]
express  = [{"id": f"p{i}", "offset": o,
             "data": [round(random.gauss(0, 1), 2) for _ in range(3)]}
            for i, o in enumerate(offsets)]

# Variants: point markers at genomic positions.
snps = [{"id": f"rs{1000+k}", "offset": random.randint(45, 520),
         "fill": "rgb(200,40,40)", "outline": "rgb(0,0,0)"} for k in range(9)]

data = {"tracks": [
    {"name": "Genes (exon models)", "type": "box", "connect": True, "data": genes},
    {"name": "Coverage — Heart / Liver / Kidney", "type": "bar", "height": 120,
     "fill": "rgb(80,80,200)", "outline": "rgb(60,60,60)", "data": coverage},
    {"name": "Expression (z-score)", "type": "heatmap", "height": 90, "data": express},
    {"name": "SNPs", "type": "triangle", "data": snps},
]}

The plot

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

config = {
    "graphType": "Genome",
    "background": "rgb(245,245,245)",
    "featureStaggered": True,
    "title": "Multi-track genome browser: genes, coverage, expression and variants",
}

cx = CanvasXpress(render_to="genome", data=data, config=config, width=760, height=520)
for part in CXNoteBook(cx).render():
    display(part)

Scroll/drag to pan and zoom into a region; every track stays locked to the shared coordinate axis, so the gene models, coverage, expression and variants line up position-for-position. Swap each track for your own pileup, annotation and VCF-derived data.

Why “reproducible”

The tracks and config are the figure — one portable JSON spec that renders the identical browser view from R or JavaScript, and can be validated and re-rendered later.

Interactive network graphs in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Oncoprints (mutation landscapes) in Python with canvasxpress

Isaac Neuhaus — Tue, 27 Oct 2026 04:00:00 GMT

An oncoprint is the standard way to show a mutation landscape: genes down one axis, tumours along the other, each cell stacking the alterations that gene carries in that sample — copy-number amplification/deletion plus mutation type — with frequencies alongside. In Python there is no first-class oncoprint; people hand-build one in matplotlib. Here we build an interactive one with canvasxpress, from a single portable spec.

Install

pip install canvasxpress

The data shape

An oncoprint is a Heatmap with overlay matrices: a base matrix (y, here expression) plus same-shaped layers for copy-number (data2) and mutation (data3). Each overlay cell is a string like "Amplification", "Missense", or "" for none.

import random
random.seed(5)

genes = ["TP53", "KRAS", "PIK3CA", "PTEN", "EGFR", "BRAF",
         "APC", "RB1", "NF1", "MYC", "CDKN2A", "ARID1A"]
samples = [f"T{i+1:02d}" for i in range(28)]
mutrate = {g: max(0.05, 0.5 * (1 - i / len(genes))) for i, g in enumerate(genes)}

CNA = ["Amplification", "Deletion"]; MUT = ["Missense", "Nonsense", "Truncating"]
base, cna, mut = [], [], []
for g in genes:
    base.append([round(random.gauss(0, 1), 2) for _ in samples])
    cna.append([random.choice(CNA) if random.random() < mutrate[g] * 0.5 else "" for _ in samples])
    mut.append([random.choice(MUT) if random.random() < mutrate[g] else "" for _ in samples])

subtype = [random.choice(["Basal", "Luminal", "HER2"]) for _ in samples]
pathway = [("TSG", "Oncogene")[i % 2] for i in range(len(genes))]

The plot

The overlays go in the y object alongside the base data; oncoprintCNA / oncoprintMUT name them, and xAxis lists the samples.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {"y": {"vars": genes, "smps": samples, "data": base, "data2": cna, "data3": mut},
        "x": {"Subtype": subtype}, "z": {"Pathway": pathway}}
config = {"graphType": "Heatmap", "oncoprintCNA": "data2", "oncoprintMUT": "data3",
          "overlaysThickness": 100, "xAxis": samples,
          "title": "Mutation landscape: 12 genes across 28 tumours"}

cx = CanvasXpress(render_to="onco", data=data, config=config, width=820, height=440)
for part in CXNoteBook(cx).render():
    display(part)

canvasXpress sorts the waterfall for you and shows the alteration frequency per row. Hover a cell to read the exact alteration; swap the overlays for your own MAF / CNA calls.

Why “reproducible”

The base matrix, the overlays and the config are the figure — one portable JSON spec that renders the identical oncoprint from R or JavaScript, and can be validated and re-rendered later.

A clustered heatmap in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Circular (Circos-style) multi-track plots in Python with canvasxpress

Isaac Neuhaus — Sat, 24 Oct 2026 04:00:00 GMT

A circular (Circos-style) plot wraps a genome — or any ordered set of segments — into a ring, stacks several data tracks around it, and draws ribbons for relationships between positions. In Python the usual tool is pyCirclize. Here we build an interactive one with canvasxpress, from a single portable spec.

Install

pip install canvasxpress

The data shape

The matrix is tracks × segments (rows are the tracks you draw, columns are the positions around the ring). A sample annotation segments the ring (here into chromosomes), and circularConnections is a list of [colour, from, to] ribbons.

import random
random.seed(8)

segments = [f"s{i+1}" for i in range(80)]
tracks   = ["Expression", "Methylation", "CopyNumber", "Density"]
data_m   = [[round(random.gauss(0, 1), 2) for _ in segments] for _ in tracks]

region = [f"chr{i//20 + 1}" for i in range(80)]
cols   = ["rgb(220,40,40)", "rgb(40,120,220)", "rgb(40,160,60)", "rgb(240,150,20)"]
conns  = [[random.choice(cols), random.choice(segments), random.choice(segments)] for _ in range(18)]

The plot

circularTrackGraphType picks a renderer per track (bar, heatmap, line, dot), circularTrackGraphWeight sets each track’s radial thickness, and segregateSamplesBy splits the ring by the annotation.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {"y": {"vars": tracks, "smps": segments, "data": data_m}, "x": {"Region": region}}
config = {
    "graphType": "Circular",
    "circularConnections": conns,
    "circularTrackGraphType": ["bar", "heatmap", "line", "dot"],
    "circularTrackGraphWeight": [30, 20, 25, 25],
    "circularTrackName": [1, 2, 3, 4],
    "segregateSamplesBy": ["Region"],
    "title": "Circos-style multi-track plot with connections",
}

cx = CanvasXpress(render_to="circ", data=data, config=config, width=560, height=560)
for part in CXNoteBook(cx).render():
    display(part)

Each ring is one track; the inner ribbons are the connections. Hover a segment to read its values; swap the matrix and ribbons for your own genomic tracks and interactions.

Why “reproducible”

The matrix, the connections and the config are the figure — one portable JSON spec that renders the identical circular plot from R or JavaScript, and can be validated and re-rendered later.

Genome browser tracks in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Choropleth maps in Python with canvasxpress

Isaac Neuhaus — Wed, 07 Oct 2026 04:00:00 GMT

A choropleth shades each region by a value — emissions, incidence, turnout, income. It is the most common map in data analysis and the easiest to get subtly wrong: most “my map is all one colour” complaints are not rendering bugs but scale bugs. Here we build a choropleth in Python with canvasxpress that stays vivid and honest on exactly the kind of heavy-tailed data that flattens naive maps. The join and the colouring happen inside the render, so every figure is one portable spec you can re-run from Python, R or the browser.

Install

pip install canvasxpress pandas

First, the trap: colour encodes a rate, not a count

A choropleth fills an area, and area is a size channel your eye cannot help reading. Shade regions by a raw count — total cases, total emissions, total sales — and big, populous regions light up simply because they are big and populous. You have drawn a population map with extra steps.

The fix is almost always to map a rate or density: cases per 100k, emissions per capita, sales per store. Reserve raw counts for a proportional-symbol map (a sized bubble at each centroid), where the size channel carries the count honestly. Decide which question you are answering before you pick the geometry — this one choice prevents most misleading maps.

One value per region

A choropleth needs exactly one measurement per shape. In canvasxpress the columns (smps) are the regions — they match the map by name — and each row (vars) is a variable you can colour by. Here it’s CO₂ emissions per country for 2018. We load a prepared table; swap it for your own (any country → value table works).

import pandas as pd

dat = pd.read_csv(
    "https://www.canvasxpress.org/data/r/cX-CO2-dat.txt",
    sep="\t", index_col=0,
)
smp = pd.read_csv(
    "https://www.canvasxpress.org/data/r/cX-CO2-smp.txt",
    sep="\t", index_col=0,
).reindex(dat.columns)        # align annotation to the country order

print(dat.shape)              # (1, N): one row (CO2) x N countries
dat.iloc[:, :4]

(1, 198)

	Afghanistan	Albania	Algeria	Andorra
CO2	10.452666	5.402999	164.309295	0.46421

The map: quantile classes on a viridis ramp

y carries the matrix (vars = the variable, smps = the countries, data = the values); the optional x block adds per-country annotations (continent, ISO code) for richer tooltips. The two choices that make this map work are in the colour scale: a seven-stop viridis colorSpectrum, and colorSpectrumBreaksMethod = "quantile", which puts an equal number of countries in every colour class. On skewed data that guarantee is what keeps all seven colours on the map.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {
    "y": {
        "vars": list(dat.index),            # ["CO2"]
        "smps": list(dat.columns),          # country names
        "data": dat.values.tolist(),        # [[values]]
    },
    "x": {
        "Continent": smp["Continent"].tolist(),
        "Code":      smp["Code"].tolist(),
    },
}

config = {
    "graphType": "Map",
    "colorBy":   "CO2",
    "topoJSON":  "https://www.canvasxpress.org/data/maps/WORLD.json",
    "mapId":     "co2Quantile",
    "colorSpectrum": ["#440154", "#443983", "#31688e", "#21918c",
                      "#35b779", "#90d743", "#fde725"],
    "colorSpectrumBreaksMethod": "quantile",
    "mapColor":        "#d9dde3",
    "mapOutlineColor": "#ffffff",
    "legendPosition":  "bottom",
    "title":    "CO2 emissions per country (2018)",
    "subtitle": "Seven quantile classes: each colour holds about 28 of 198 countries",
}

cx = CanvasXpress(render_to="co2quant", data=data, config=config, width=760, height=520)
for part in CXNoteBook(cx).render():
    display(part)

Every band of the ramp is doing work: the darkest purples are the smallest emitters, the yellows the largest, and the legend’s break values tell you the class edges are data-driven, not evenly spaced. Hover any country for its name, continent and value.

Why not just a plain linear ramp?

Because the data is heavy-tailed — a few countries emit thousands of megatonnes while most emit almost nothing. On a linear scale, 195 of these 198 countries fall into the bottom fifth of the range, so a continuous ramp paints nearly the whole world one pale tone and spends its colour on two or three outliers:

linear = {
    "graphType": "Map",
    "colorBy":   "CO2",
    "topoJSON":  "https://www.canvasxpress.org/data/maps/WORLD.json",
    "mapId":     "co2Linear",
    "legendPosition": "left",
    "theme": "solarized",
    "title":    "The same data on a plain linear ramp",
    "subtitle": "195 of 198 countries sit in the bottom fifth of the scale - the map goes flat",
}

cx = CanvasXpress(render_to="co2lin", data=data, config=linear, width=700, height=480)
for part in CXNoteBook(cx).render():
    display(part)

This is the single most common choropleth failure. The cure is classing:

"colorSpectrumBreaksMethod": "quantile" — equal counts per class. Every colour is used, by construction. The right default for skewed data and for “which regions rank high/low” questions.
"colorSpectrumBreaksMethod": "jenks" — natural breaks that minimise within-class variance. Best when the data has genuine clusters with gaps between them; on smoothly heavy-tailed data like this it piles almost everything into the bottom class, so check the legend before you trust it.
Three to seven classes is the usable range — beyond that, readers cannot match colours to the legend.

Choose the palette on purpose

The palette is the scale’s grammar, not decoration:

Sequential (dark → light of ordered hues, like viridis above) for a quantity that only goes up: counts, rates, concentrations.
Diverging (two hues meeting at a neutral midpoint) when values are meaningful above and below a reference: change vs. last year, difference from a target, a signed index. Give a three-colour colorSpectrum and pin the midpoint with colorSpectrumZeroValue:
```
"colorBy": "Change",
"colorSpectrum": ["#2166ac", "#f7f7f7", "#b2182b"],  # blue - neutral - red
"colorSpectrumZeroValue": 0,                          # value mapped to the middle colour
```
Never use a diverging palette for a purely positive quantity — the neutral midpoint invents a “normal” the data does not have.

Viridis and the ColorBrewer ramps are colour-blind-safe and perceptually ordered; a rainbow ramp is neither, so readers cannot tell which end means “more”. Keep the same scale across small multiples so maps stay comparable.

Polish: legend, labels and base styling

subtitle / source — caption units and provenance.
"legendNumberFormat": {"style": "decimal", "decimals": 1, "suffix": "%"} — format legend ticks.
mapColor / mapOutlineColor — the fill for no-data regions (a neutral grey) and the shape borders, so missing data reads as missing rather than as a value.
"showMapLabels": True — draw region names (best on few-region maps; clutters a world map).
"legendInside": True — float the legend over empty ocean to reclaim width.

Beyond the world map

Other boundaries. Point topoJSON at any shape file — US states, a country’s provinces, counties, custom districts. The join key is just the shape name.
Projection. "mapProjection": "albers" (equal-area) or "mercator". Equal-area projections matter for choropleths: Mercator inflates high latitudes and exaggerates their visual weight.
Categorical maps. Point colorBy at a categorical column for a qualitative choropleth with a discrete legend.
Markers. Add decorations to drop labelled points on cities or call out specific regions.

The whole figure — data, boundaries, classing rule and palette — is one portable spec you can store, validate and re-render from R or JavaScript.

Sankey / alluvial diagrams in Python with canvasxpress

Isaac Neuhaus — Sun, 27 Sep 2026 04:00:00 GMT

A Sankey (or alluvial) diagram shows how a quantity flows through a sequence of categorical stages — patients moving from a cohort, to a treatment, to an outcome; or reads from a sample, to a mapping status, to a feature. The width of each stream is the magnitude. Here we build one in Python with canvasxpress — interactive and reproducible.

Install

pip install canvasxpress

The data shape

canvasXpress builds a Sankey from a table where each row is one path through the stages, plus a frequency/weight. Swap this simulated clinical flow for your own counts.

import random
random.seed(1)

cohorts  = ["Cohort A", "Cohort B"]
treats   = ["Drug 1", "Drug 2", "Placebo"]
outcomes = ["Response", "Stable", "Progression"]

Cohort, Treatment, Outcome, Freq = [], [], [], []
for co in cohorts:
    for tr in treats:
        for ou in outcomes:
            base = 40 if ou == "Response" else 25 if ou == "Stable" else 15
            if tr == "Placebo" and ou == "Response":
                base = 12                                   # placebo responds less
            Cohort.append(co); Treatment.append(tr); Outcome.append(ou)
            Freq.append(base + random.randint(0, 15))

The value (Freq) is the single measured variable; the stage columns are sample annotations (x).

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

ids = [f"r{i+1}" for i in range(len(Freq))]
data = {
    "y": {"vars": ["Freq"], "smps": ids, "data": [Freq]},
    "x": {"Cohort": Cohort, "Treatment": Treatment, "Outcome": Outcome},
}

config = {
    "graphType": "Sankey",
    "sankeyAxes": ["Cohort", "Treatment", "Outcome"],
    "xAxis": ["Freq"],
    "colorBy": "Outcome",
    "sankeyType": "proportional",
    "graphOrientation": "horizontal",
    "title": "Patient flow: cohort to treatment to outcome",
}

cx = CanvasXpress(render_to="sankey", data=data, config=config, width=700, height=500)
for part in CXNoteBook(cx).render():
    display(part)

Hover any stream to see the count; the widths are proportional to the frequency, so you can read the flow at a glance. sankeyType can also be "aligned" (classic alluvial) or "equal".

Why “reproducible”

The data+config is the figure — one portable JSON spec. The same spec renders the identical Sankey from R or JavaScript, and can be validated and re-rendered later.

Interactive volcano plots in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Violin and half (split) violin plots in Python with canvasxpress

Isaac Neuhaus — Sat, 26 Sep 2026 04:00:00 GMT

A violin plot shows the full shape of a distribution instead of collapsing it to a box’s quartiles. And when you want to compare two conditions at the same position, a split (half) violin puts one condition on each half. Here we build both in Python with canvasxpress — interactive and reproducible.

Install

pip install canvasxpress

The data

A measurement across a few dose groups and two conditions. Swap in your own long-format table.

import numpy as np

rng = np.random.default_rng(1)
doses = ["Low", "Medium", "High"]
conds = ["Control", "Treated"]

value, Dose, Condition = [], [], []
for d in doses:
    for co in conds:
        mu = {"Low": 6, "Medium": 8, "High": 10}[d] + (1.5 if co == "Treated" else 0)
        value += list(np.round(rng.normal(mu, 1.2, 40), 2))
        Dose += [d] * 40
        Condition += [co] * 40

In canvasXpress terms a violin is a Boxplot graph with the violin turned on: one measured variable × N observations, with the grouping columns as sample annotations (x).

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

ids = [f"o{i+1}" for i in range(len(value))]
data = {"y": {"vars": ["value"], "smps": ids, "data": [value]},
        "x": {"Dose": Dose, "Condition": Condition}}

A full violin per group

cx = CanvasXpress(render_to="violin", data=data, config={
    "graphType": "Boxplot", "showViolinBoxplot": True, "violinScale": "area",
    "groupingFactors": ["Dose"], "xAxis": ["value"], "smpTitle": "Dose",
    "title": "Distribution of value by dose",
}, width=650, height=500)
for part in CXNoteBook(cx).render():
    display(part)

A split (half) violin comparing two conditions

Group by both factors, colour by condition, and set violinSide = "split" — the two conditions share each dose position, one on each half.

cx = CanvasXpress(render_to="violinSplit", data=data, config={
    "graphType": "Boxplot", "showViolinBoxplot": True, "violinScale": "area",
    "groupingFactors": ["Dose", "Condition"], "colorBy": "Condition",
    "violinSide": "split", "violinTrim": False, "xAxis": ["value"], "smpTitle": "Dose",
    "title": "Control vs Treated — split violin by dose",
}, width=650, height=500)
for part in CXNoteBook(cx).render():
    display(part)

Hover to read the density and summary stats. violinSide can also be "lt" or "rb" for a one-sided half violin.

Why “reproducible”

The data+config is the figure — one portable JSON spec that renders the identical violins from R or JavaScript.

Clustered heatmaps in Python with canvasxpress

Isaac Neuhaus — Thu, 24 Sep 2026 04:00:00 GMT

The clustered heatmap is the default way to look at an expression matrix: rows and columns reordered by similarity, dendrograms on the margins, and sample metadata alongside. Here we build one in Python with canvasxpress — clustering happens inside the render, so you pass a plain matrix and get an interactive, reproducible figure.

Install

pip install canvasxpress

An expression matrix with sample metadata

Swap this simulated block for your own matrix (genes in rows, samples in columns) and a table of per-sample annotations.

import numpy as np
import pandas as pd

rng   = np.random.default_rng(1)
ng, ns = 40, 30
genes = [f"Gene{i+1}" for i in range(ng)]
samps = [f"S{i+1}"    for i in range(ns)]
cond  = ["Tumor"] * (ns // 2) + ["Normal"] * (ns // 2)

m = rng.normal(0, 1, (ng, ns))
tumor = [i for i, c in enumerate(cond) if c == "Tumor"]
normal = [i for i, c in enumerate(cond) if c == "Normal"]
m[np.ix_(range(0, 20),  tumor)]  += 2      # first block up in Tumor
m[np.ix_(range(20, 40), normal)] += 2      # second block up in Normal

expr = pd.DataFrame(m.round(3), index=genes, columns=samps)

Build the spec

The matrix goes in as data, and the sample annotation becomes an annotation track over the columns. samplesClustered / variablesClustered turn on hierarchical clustering with dendrograms.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {
    "y": {"vars": genes, "smps": samps, "data": expr.values.tolist()},
    "x": {"Condition": cond},
}

config = {
    "graphType": "Heatmap",
    "samplesClustered": True, "variablesClustered": True,
    "colorSpectrum": ["navy", "white", "firebrick3"],
    "showSmpDendrogram": True, "showVarDendrogram": True,
    "title": "Clustered expression heatmap",
}

cx = CanvasXpress(render_to="heatmap", data=data, config=config, width=650, height=550)
for part in CXNoteBook(cx).render():
    display(part)

Rows and columns are reordered by similarity, the dendrograms show the clustering, and the samples separate cleanly by condition. Hover a cell for its gene, sample and value; the whole figure is one portable spec you can store, validate and re-render from R or JavaScript.

Kaplan–Meier survival curves in Python with canvasxpress

Isaac Neuhaus — Wed, 23 Sep 2026 04:00:00 GMT

Kaplan–Meier curves summarize time-to-event data: the step-down survival probability over time, usually split by a group like treatment arm. Here we build one in Python with canvasxpress — it computes the survival steps for you from a time column and a censoring column — and the result is interactive and reproducible.

Install

pip install canvasxpress

A survival table

Swap this simulated block for your own data: per subject you need a follow-up time, a censoring indicator (1 = censored, 0 = event), and the grouping variable.

import numpy as np

rng  = np.random.default_rng(1)
n    = 200
arm  = rng.choice(["Treatment", "Control"], n)
base = np.where(arm == "Treatment", 60, 40)     # treatment survives longer
time = np.round(rng.exponential(base), 1)
cens = rng.binomial(1, 0.3, n)                  # 1 = censored, 0 = event
subj = [f"Subj{i+1}" for i in range(n)]

Build the spec

The two columns — the time and its matching censor flag — go in as the variable samples, and the arm rides along as a variable annotation. The key is graphType="KaplanMeier" and passing both columns to xAxis.

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {
    # Subjects are the variables (rows); each row holds [Time, Time-Censor].
    "y": {"vars": subj, "smps": ["Time", "Time-Censor"],
          "data": [[t, c] for t, c in zip(time.tolist(), cens.tolist())]},
    "z": {"Arm": arm.tolist()},
}

config = {
    "graphType": "KaplanMeier",
    "xAxis": ["Time", "Time-Censor"],
    "colorBy": "Arm",
    "title": "Overall survival by treatment arm",
    "xAxisTitle": "Time (weeks)", "yAxisTitle": "Probability of survival",
    "invertCensored": True,               # draw censoring ticks
    "showKMConfidenceIntervals": False,
}

cx = CanvasXpress(render_to="km", data=data, config=config, width=650, height=500)
for part in CXNoteBook(cx).render():
    display(part)

Hover any step for the time and survival probability; the tick marks are censored subjects. canvasxpress derives the survival curve from the raw table, so you never precompute the steps — and the same spec re-renders the identical curve from R or JavaScript.

A common gotcha

The survival transform only fires with graphType="KaplanMeier". A bare "Scatter2D" gives a raw scatter of the censor values instead — survival probability is computed by the engine, not a column in your data.

Interactive volcano plots in Python
Gallery: https://canvasxpress.org/examples.html
Package: https://pypi.org/project/canvasxpress/

Interactive volcano plots in Python with canvasxpress

Isaac Neuhaus — Tue, 22 Sep 2026 04:00:00 GMT

A volcano plot is the workhorse of differential-expression analysis: log fold change on x, statistical significance on y, and the interesting genes pushed to the top corners. Here we build one in Python with canvasxpress — interactive (zoom, hover, filter) and reproducible: the whole figure is one portable specification you can store and re-render from Python, R or JavaScript.

Install

pip install canvasxpress

A differential-expression table

Swap this simulated block for your own results — the output of any DE pipeline works, as long as you have a log fold change and a significance value per gene.

import numpy as np
import pandas as pd
from scipy.stats import norm

rng = np.random.default_rng(1)
n = 1000
genes = [f"Gene{i+1}" for i in range(n)]

# Simulate a realistic volcano: most genes have no real effect, a minority are
# differentially expressed. Significance follows effect size / standard error, which
# is what gives a volcano its shape.
de     = rng.random(n) < 0.12                              # ~12% truly changed
sign   = rng.choice([-1, 1], n)
effect = np.where(de, sign * (0.8 + 0.9 * rng.random(n)), 0.0)   # true log2FC
se     = 0.22 + 0.5 * rng.random(n)                        # per-gene standard error
logfc  = effect + rng.normal(0, se)                        # observed log2FC
pval   = 2 * norm.sf(np.abs(logfc / se))                   # z-test p-value
neglogp = np.minimum(-np.log10(pval), 16)

df = pd.DataFrame({"logFC": logfc.round(3), "-log-pVal": neglogp.round(3)}, index=genes)

def classify(fc, p):
    if fc > 1 and p > 1.3:   return "Increased"
    if fc < -1 and p > 1.3:  return "Decreased"
    return "NoChange"

group = [classify(fc, p) for fc, p in zip(df["logFC"], df["-log-pVal"])]
fold  = (2 ** df["logFC"].abs()).round(2)

Build the spec

canvasxpress takes a data object (a value matrix plus annotations) and a config. We put the two measurements as the variable’s samples and carry the regulation call and fold change as variable annotations (z).

from canvasxpress.canvas import CanvasXpress
from canvasxpress.render.jupyter import CXNoteBook
from IPython.display import display

data = {
    # Genes are the variables (rows); each row holds [logFC, -log-pVal].
    "y": {"vars": genes, "smps": ["logFC", "-log-pVal"],
          "data": [[fc, p] for fc, p in zip(df["logFC"], df["-log-pVal"])]},
    "z": {"Group": group, "FC": fold.tolist()},
}

config = {
    "graphType": "Scatter2D",
    "title": "Publication-ready volcano plot",
    "xAxis": ["logFC"], "yAxis": ["-log-pVal"],
    "xAxisTitle": "log2 fold change", "yAxisTitle": "-log10 p-value",
    "colorBy": "Group",
    "colorKey": {"Group": {"Increased": "rgba(197,27,38,0.75)",
                            "Decreased": "rgba(33,102,172,0.75)",
                            "NoChange":  "rgba(150,150,150,0.35)"}},
    "sizeBy": "FC", "sizes": [3, 6, 9, 12, 15],
    "showDecorations": True,
    "decorations": {"line": [
        {"color": "rgba(120,120,120,0.8)", "width": 1, "x": 1},
        {"color": "rgba(120,120,120,0.8)", "width": 1, "x": -1},
        {"color": "rgba(120,120,120,0.8)", "width": 1, "y": 1.301},
    ]},
}

cx = CanvasXpress(render_to="volcano", data=data, config=config, width=650, height=500)
for part in CXNoteBook(cx).render():
    display(part)

The chart is interactive — hover a point for its gene and values, drag to zoom, filter by regulation group in the toolbar. The dashed guides mark the ±1 log2FC and p = 0.05 cutoffs.

Why “reproducible”

Everything above serializes to one JSON specification — the data and the config. That spec is portable: the identical figure renders from the R (canvasXpress) and JavaScript packages, and it can be validated against a published schema and re-rendered later, so a figure in a paper can be regenerated and audited rather than just viewed.

Gallery of examples: https://canvasxpress.org/examples.html
Coming from Plotly/Matplotlib: https://canvasxpress.org/migrate.html
Package: https://pypi.org/project/canvasxpress/

CanvasXpress Recipes

Interactive network graphs in Python with canvasxpress

Install

The data shape

The plot

Why “reproducible”

Next

An interactive NGS sequencing-QC dashboard in Python with canvasxpress

Install

The QC table

Overview — a clustered QC heatmap

The linked triage dashboard

1 — Mapping rate vs duplication (the triage plot)

2 — Contamination vs mapping

3 — Q30 vs GC, by library prep

4 — Sequencing depth per sample

Why “reproducible”

Next

Genome browser tracks in Python with canvasxpress

Install

The data shape

The plot

Why “reproducible”

Next

Oncoprints (mutation landscapes) in Python with canvasxpress

Install

The data shape

The plot

Why “reproducible”

Next

Circular (Circos-style) multi-track plots in Python with canvasxpress

Install

The data shape

The plot

Why “reproducible”

Next

Choropleth maps in Python with canvasxpress

Install

First, the trap: colour encodes a rate, not a count

One value per region

The map: quantile classes on a viridis ramp

Why not just a plain linear ramp?

Choose the palette on purpose

Polish: legend, labels and base styling

Beyond the world map

Next

Sankey / alluvial diagrams in Python with canvasxpress

Install

The data shape

Why “reproducible”

Next

Violin and half (split) violin plots in Python with canvasxpress

Install

The data

A full violin per group

A split (half) violin comparing two conditions

Why “reproducible”

Next

Clustered heatmaps in Python with canvasxpress

Install

An expression matrix with sample metadata

Build the spec

Next

Kaplan–Meier survival curves in Python with canvasxpress

Install

A survival table

Build the spec

A common gotcha

Next

Interactive volcano plots in Python with canvasxpress

Install

A differential-expression table

Build the spec

Why “reproducible”

Next