Published-release documentation · 281 actions; release compatibility · contract 5520b0fa9525
Apply, override, and remove a theme
Apply reusable defaults, preserve an intentional local override, and remove the active theme.
Prerequisites
Use the Getting Started browser module setup, install the full
ggaction entry, and provide <canvas id="chart"></canvas>. This complete example
includes its data and imports. These APIs require ggaction 0.0.15 or later;
check the documentation version for release compatibility.
Decision sequence: scatterplot → theme and mark-style editing.
Complete program
import { chart, hconcat } from "ggaction";
import { render } from "ggaction";
export function createCustomThemeWorkflow() {
const base = chart()
.createCanvas({ width: 360, height: 280, margin: 60 })
.createData({ values: [{ x: 1, y: 2 }, { x: 3, y: 4 }] })
.createScatterPlot({ id: "points", x: "x", y: "y" });
const themed = base.applyTheme({ theme: { base: "light", tokens: {
background: "#f5f3ff", mark: "#7c3aed", axis: "#5b21b6"
} } });
const overridden = themed.editPointMark({ target: "points", fill: "#ea580c" });
const restored = overridden.removeTheme();
return hconcat({ programs: [
themed.createTitle({ text: "Custom theme" }),
overridden.createTitle({ text: "Orange override" }),
restored.createTitle({ text: "Theme removed" })
], gap: 16 });
}
const program = createCustomThemeWorkflow();
render(program, document.querySelector("#chart").getContext("2d"));
Expected result
The first panel uses a lavender background and purple default marks. The second changes those marks to orange. The third restores baseline theme defaults while retaining the explicit orange fill.
Boundaries and failure behavior
Theme defaults and explicit mark properties have separate precedence. Removing a theme does not undo the user’s local override. On a composition, choose the documented scope deliberately; this example themes independent child programs before composition. Unknown token names fail without changing the input.
Related
Authoring conventions · Data policies · Complete action reference