Skip to content

fix: legend, style persistence, and axis ranges in combined figures #53

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
FBumann merged 7 commits into from
Mar 17, 2026
Merged

fix: legend, style persistence, and axis ranges in combined figures #53

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
fdbd29f
fix: legend visibility, style persistence, and axis ranges in combine…
FBumann Mar 17, 2026
c1d985c
feat: add subplots() for composing figures into a grid
FBumann Mar 17, 2026
dda84c7
docs: add subplots examples to combining notebook
FBumann Mar 17, 2026
a9d6247
feat: support faceted figures in subplots()
FBumann Mar 17, 2026
0cb6e6d
fix: review findings — datetime axis, bar baseline, type narrowing, s…
FBumann Mar 17, 2026
83ae531
fix: disambiguation condition and stale comment
FBumann Mar 17, 2026
f06987e
fix: unused variable lint error in test
FBumann Mar 17, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
156 changes: 140 additions & 16 deletions docs/examples/combining.ipynb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
"xarray-plotly provides helper functions to combine multiple figures:\n",
"\n",
"- **`overlay`**: Overlay traces on the same axes\n",
"- **`add_secondary_y`**: Plot with two independent y-axes"
"- **`add_secondary_y`**: Plot with two independent y-axes\n",
"- **`subplots`**: Arrange independent figures in a grid"
]
},
{
Expand All @@ -23,7 +24,7 @@
"import plotly.express as px\n",
"import xarray as xr\n",
"\n",
"from xarray_plotly import add_secondary_y, config, overlay, xpx\n",
"from xarray_plotly import add_secondary_y, config, overlay, subplots, xpx\n",
"\n",
"config.notebook()"
]
Expand Down Expand Up @@ -440,6 +441,128 @@
"cell_type": "markdown",
"id": "27",
"metadata": {},
"source": [
"## subplots\n",
"\n",
"Arrange independent figures side-by-side in a grid. Each figure gets its own\n",
"subplot cell with axes and title automatically derived from the source figure."
]
},
{
"cell_type": "markdown",
"id": "28",
"metadata": {},
"source": [
"### Different Variables Side by Side"
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "29",
"metadata": {},
"outputs": [],
"source": [
"# One figure per variable, arranged in a row\n",
"us_pop = population.sel(country=\"United States\")\n",
"us_gdp = gdp_per_capita.sel(country=\"United States\")\n",
"us_life = life_expectancy.sel(country=\"United States\")\n",
"\n",
"pop_fig = xpx(us_pop).bar(title=\"Population\")\n",
"gdp_fig = xpx(us_gdp).line(title=\"GDP per Capita\")\n",
"life_fig = xpx(us_life).line(title=\"Life Expectancy\")\n",
"\n",
"grid = subplots(pop_fig, gdp_fig, life_fig, cols=3)\n",
"grid.update_layout(title=\"United States Overview\", height=350, showlegend=False)\n",
"grid"
]
},
{
"cell_type": "markdown",
"id": "30",
"metadata": {},
"source": [
"### 2x2 Grid\n",
"\n",
"Use `cols=2` and pass four figures for a 2x2 layout."
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "31",
"metadata": {},
"outputs": [],
"source": [
"# One subplot per country\n",
"fig_us = xpx(population.sel(country=\"United States\")).bar(title=\"United States\")\n",
"fig_cn = xpx(population.sel(country=\"China\")).bar(title=\"China\")\n",
"fig_de = xpx(population.sel(country=\"Germany\")).bar(title=\"Germany\")\n",
"fig_br = xpx(population.sel(country=\"Brazil\")).bar(title=\"Brazil\")\n",
"\n",
"grid = subplots(fig_us, fig_cn, fig_de, fig_br, cols=2)\n",
"grid.update_layout(height=500, showlegend=False)\n",
"grid"
]
},
{
"cell_type": "markdown",
"id": "32",
"metadata": {},
"source": [
"### Mixed Chart Types\n",
"\n",
"Each cell can use a different chart type. Subplot titles fall back to the\n",
"y-axis label when no explicit title is set."
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "33",
"metadata": {},
"outputs": [],
"source": [
"# No explicit title — subplot titles come from the y-axis label (DataArray name)\n",
"pop_bar = xpx(us_pop).bar()\n",
"gdp_line = xpx(us_gdp).line()\n",
"life_scatter = xpx(us_life).scatter()\n",
"\n",
"grid = subplots(pop_bar, gdp_line, life_scatter, cols=3)\n",
"grid.update_layout(height=350, showlegend=False)\n",
"grid"
]
},
{
"cell_type": "markdown",
"id": "34",
"metadata": {},
"source": [
"### With Facets\n",
"\n",
"Faceted figures can be composed — each figure's internal subplots are remapped into the grid cell."
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "35",
"metadata": {},
"outputs": [],
"source": [
"# Faceted bar on top, faceted line below\n",
"pop_faceted = xpx(population).bar(facet_col=\"country\")\n",
"gdp_faceted = xpx(gdp_per_capita).line(facet_col=\"country\")\n",
"\n",
"grid = subplots(pop_faceted, gdp_faceted, cols=1)\n",
"grid.update_layout(height=600, showlegend=False)\n",
"grid"
]
},
{
"cell_type": "markdown",
"id": "36",
"metadata": {},
"source": [
"---\n",
"\n",
Expand All @@ -450,7 +573,7 @@
},
{
"cell_type": "markdown",
"id": "28",
"id": "37",
"metadata": {},
"source": [
"### overlay: Mismatched Facet Structure\n",
Expand All @@ -461,7 +584,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "29",
"id": "38",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -479,7 +602,7 @@
},
{
"cell_type": "markdown",
"id": "30",
"id": "39",
"metadata": {},
"source": [
"### overlay: Animated Overlay on Static Base\n",
Expand All @@ -490,7 +613,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "31",
"id": "40",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -508,7 +631,7 @@
},
{
"cell_type": "markdown",
"id": "32",
"id": "41",
"metadata": {},
"source": [
"### overlay: Mismatched Animation Frames\n",
Expand All @@ -519,7 +642,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "33",
"id": "42",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -535,7 +658,7 @@
},
{
"cell_type": "markdown",
"id": "34",
"id": "43",
"metadata": {},
"source": [
"### add_secondary_y: Mismatched Facet Structure\n",
Expand All @@ -546,7 +669,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "35",
"id": "44",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -564,7 +687,7 @@
},
{
"cell_type": "markdown",
"id": "36",
"id": "45",
"metadata": {},
"source": [
"### add_secondary_y: Animated Secondary on Static Base\n",
Expand All @@ -575,7 +698,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "37",
"id": "46",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -593,7 +716,7 @@
},
{
"cell_type": "markdown",
"id": "38",
"id": "47",
"metadata": {},
"source": [
"### add_secondary_y: Mismatched Animation Frames"
Expand All @@ -602,7 +725,7 @@
{
"cell_type": "code",
"execution_count": null,
"id": "39",
"id": "48",
"metadata": {},
"outputs": [],
"source": [
Expand All @@ -618,15 +741,16 @@
},
{
"cell_type": "markdown",
"id": "40",
"id": "49",
"metadata": {},
"source": [
"## Summary\n",
"\n",
"| Function | Facets | Animation | Static + Animated |\n",
"|----------|--------|-----------|-------------------|\n",
"| `overlay` | Yes (must match) | Yes (frames must match) | Static overlay on animated base OK |\n",
"| `add_secondary_y` | Yes (must match) | Yes (frames must match) | Static secondary on animated base OK |"
"| `add_secondary_y` | Yes (must match) | Yes (frames must match) | Static secondary on animated base OK |\n",
"| `subplots` | Yes (remapped into cells) | No | N/A |"
]
}
],
Expand Down
Loading
Loading