Interface: ComponentDrawContext

Experimental

Context for component drawing: the solved layout and the overlay viewport.

Properties

Property	Modifier	Type	Description
axes	readonly	ReadonlyMap<string, AxisInfo>	Experimental
chart?	readonly	Chart	Experimental The chart (M1 wave 2): for components that act on it — the legend restyles visible and emits legendclick (chart.emit), the modebar calls chart.setDragmode, chart.zoom, chart.resetAxes, … and places its DOM in chart.element. Always set by the runtime; optional only so contexts built by hand in tests stay valid.
fullConfig?	readonly	FullObject<{ a11y: ObjectNode<{ dataTable: Attr<false | "visible" | "hidden", { description: "The traces' data tables: `'hidden'` for screen readers only (first 100 rows), `'visible'` shown below the chart with every row (virtualized), `false` none. Holochart only (plan E17.3)."; dflt: "hidden"; values: readonly ["hidden", "visible", false]; }>; keyboard: Attr<boolean, { description: "Keyboard access: Tab reaches the plot area (the arrows step through the data, `+` / `-` zoom) and the legend items. Holochart only (plan E6.5, E17.4)."; dflt: true; }>; patterns: Attr<boolean, { description: "Give bars, histograms, polar bars, filled areas (`fillpattern`) and pie slices a distinct pattern each, as an encoding redundant with color, unless the trace or template sets one. Holochart only (plan E17.5)."; dflt: false; }>; reducedMotion: Attr<boolean | "auto", { description: "Snap transitions and drill-down tweens instead of animating them: `'auto'` when the user's system asks for reduced motion (the `prefers-reduced-motion` media query), `true` always, `false` never. Holochart only (plan E17.5)."; dflt: "auto"; values: readonly ["auto", true, false]; }>; summaries: Attr<boolean, { description: "Add generated summaries of trends and extremes ("Revenue rises from 1.2M in Jan to 3.4M in Dec") to what screen readers get. Their code loads after the first draw. Holochart only (plan E17.2)."; dflt: true; }>; }>; antialias: Attr<boolean, { description: "Request an antialiased WebGL context (fixed at context creation)."; dflt: true; }>; ariaLabel: Attr<string, { description: "The chart's accessible name (`aria-label`), read by screen readers. Empty: `layout.meta.description` when set, else the figure title followed by an automatic summary ("Line chart with 3 traces"). Holochart only (plan E17.1)."; dflt: ""; }>; debug: Attr<boolean, { description: "Log update plans and pipeline timings to the console."; dflt: false; }>; displaylogo: Attr<boolean, { description: "Accepted for Plotly compatibility and ignored: the modebar has no logo."; dflt: true; }>; displayModeBar: Attr<boolean | "hover", { description: "Show the modebar always (`true`), never (`false`) or on hover."; dflt: "hover"; values: readonly ["hover", true, false]; }>; doubleClick: Attr<false | "autosize" | "reset" | "reset+autosize", { description: "What double-clicking the plot area does."; dflt: "reset+autosize"; values: readonly [false, "reset", "autosize", "reset+autosize"]; }>; doubleClickDelay: Attr<number, { description: "Maximum delay between two clicks of a double-click, in milliseconds."; dflt: 300; min: 0; }>; editable: Attr<boolean, { description: "Make titles, legend, annotations and shapes editable in place (E6.7)."; dflt: false; }>; edits: ObjectNode<{ annotationPosition: Attr<boolean, { description: "Drag annotations."; dflt: false; }>; annotationTail: Attr<boolean, { description: "Drag annotation arrow tails."; dflt: false; }>; annotationText: Attr<boolean, { description: "Edit annotation text."; dflt: false; }>; axisTitleText: Attr<boolean, { description: "Edit axis titles."; dflt: false; }>; colorbarPosition: Attr<boolean, { description: "Drag colorbars."; dflt: false; }>; colorbarTitleText: Attr<boolean, { description: "Edit colorbar titles."; dflt: false; }>; legendPosition: Attr<boolean, { description: "Drag the legend."; dflt: false; }>; legendText: Attr<boolean, { description: "Edit trace names in the legend."; dflt: false; }>; shapePosition: Attr<boolean, { description: "Drag and resize shapes."; dflt: false; }>; titleText: Attr<boolean, { description: "Edit the figure title."; dflt: false; }>; }>; hoverRenderer: Attr<"dom", { description: "How hover labels render. Only `dom` (positioned HTML over the canvas) exists in M1; a WebGL label renderer is planned (E5.7)."; dflt: "dom"; values: readonly ["dom"]; }>; locale: Attr<string, { description: "Locale of UI strings and number and date formats, e.g. `'de'` or `'de-CH'` (which falls back to `de`, then English). Locales come from `locales` or `register()` (`@mk7s/holochart-locales` ships plotly.js's)."; dflt: "en-US"; noBlank: true; }>; locales: AttrSpec<unknown, unknown>; maxPixelRatio: Attr<number, { description: "Upper limit of the pixel ratio that `pixelRatio: "auto"` takes from the display. Raise it for sharper output on 3× screens, at the cost of drawing more pixels."; dflt: 2; max: 8; min: 0.25; }>; modeBarButtonsToAdd: AttrSpec<unknown, unknown>; modeBarButtonsToRemove: AttrSpec<string[], string[]>; pixelRatio: Attr<number | "auto", { description: "Renderer pixel ratio. `auto` uses `window.devicePixelRatio`, up to `maxPixelRatio`."; dflt: "auto"; extras: readonly ["auto"]; max: 8; min: 0.25; }>; powerPreference: Attr<"default" | "high-performance" | "low-power", { description: "WebGL context power preference hint."; dflt: "default"; values: readonly ["default", "high-performance", "low-power"]; }>; renderHover: AttrSpec<AnyFunction, | AnyFunction | undefined>; responsive: Attr<boolean, { description: "Resize the chart when its container or the window resizes."; dflt: false; }>; scrollZoom: Attr< | boolean | "map" | "cartesian" | "scene" | "geo" | `map+${string}` | `cartesian+${string}` | `scene+${string}` | `geo+${string}`, { description: "Which subplot kinds zoom on mouse wheel. `true`/`false` enable/disable all of them."; dflt: "scene+geo+map"; extras: readonly [true, false]; flags: readonly ["cartesian", "scene", "geo", "map"]; }>; sharedRenderer: Attr<boolean | "auto", { description: "Draw through one WebGL context shared by every chart on the page instead of a context per chart (browsers keep about 16, fewer on mobile). `auto` gives the first 4 charts a context of their own and shares for the rest. `false` always takes a context."; dflt: "auto"; values: readonly ["auto", true, false]; }>; staticPlot: Attr<boolean, { description: "Render once with no interactivity (no hover, zoom or modebar)."; dflt: false; }>; strict: Attr<boolean, { description: "Throw on the first validation error instead of warning (once per attribute path)."; dflt: false; }>; textRenderer: Attr<"dom" | "webgl", { description: "Render text as WebGL SDF glyphs or as a DOM overlay (ADR-005)."; dflt: "webgl"; values: readonly ["webgl", "dom"]; }>; toImageButtonOptions: ObjectNode<{ filename: Attr<string, { description: "File name."; dflt: "newplot"; noBlank: true; }>; format: Attr<"png" | "jpeg" | "webp", { description: "Image format."; dflt: "png"; values: readonly ["png", "jpeg", "webp"]; }>; height: Attr<number, { description: "Height in CSS pixels (defaults to the chart)."; min: 1; }>; scale: Attr<number, { description: "Resolution multiplier."; dflt: 1; min: 0; }>; width: Attr<number, { description: "Width in CSS pixels (defaults to the chart)."; min: 1; }>; }>; topojsonURL: Attr<string, { description: string; dflt: ""; }>; worker: Attr<boolean | "auto", { description: "Run the calc stage in a Web Worker (ADR-011). `auto` switches on above a data-size threshold."; dflt: false; values: readonly [true, false, "auto"]; }>; }>	Experimental The defaulted config (modebar options, staticPlot, …). Always set by the runtime.
fullData	readonly	readonly FullTrace[]	Experimental
fullLayout	readonly	FullLayout	Experimental
height	readonly	number	Experimental
margin	readonly	object	Experimental Resolved margins, after pushes.
margin.b	readonly	number	-
margin.l	readonly	number	-
margin.r	readonly	number	-
margin.t	readonly	number	-
overlay	readonly	Viewport	Experimental Figure-level 2D viewport covering the whole canvas, drawn last (paper-space components).
plotArea	readonly	Readonly<ViewportRect>	Experimental The plot area inside the margins, container px (top-left origin).
primitives	readonly	PrimitiveContext	Experimental
subplots	readonly	ReadonlyMap<string, SubplotInfo>	Experimental
width	readonly	number	Experimental Figure size in CSS px.

Methods

add()

add<T>(primitive, viewport?): Primitive<T>;

Experimental

Add a primitive to viewport (default: the overlay); tracked and disposed with the view.

Type Parameters

Type Parameter
T

Parameters

Parameter	Type
primitive	Primitive<T>
viewport?	Viewport

Returns

Primitive<T>

---

autorange()?

optional autorange(id): readonly [number, number] | undefined;

Experimental

The range axis id autoranges to over all of its data (traces' and components' extremes), whatever its autorange and range say, in linear coordinates (M3 wave 2, E5.9: the range slider spans all the data). undefined for an unknown axis.

Parameters

Parameter	Type
id	string

Returns

readonly [number, number] | undefined

---

calcdata()?

optional calcdata(index): unknown;

Experimental

Calcdata of trace index (M2 wave 1), e.g. for legendItems. Always set by the runtime; optional for hand-built test contexts.

Parameters

Parameter	Type
index	number

Returns

unknown

---

invalidate()

invalidate(): void;

Experimental

Returns

void

---

mirrorSubplot()?

optional mirrorSubplot(subplot, options): SubplotMirror | undefined;

Experimental

A second view of cartesian subplot subplot's traces in a viewport of its own (M3 wave 2, E5.9: the range slider's thumbnail; see SubplotMirror), or undefined when there is no such subplot. The mirror belongs to this component: dispose it when done (the runtime also disposes it with the component's view). Always set by the runtime; optional for hand-built test contexts.

Parameters

Parameter	Type
subplot	string
options	SubplotMirrorOptions

Returns

SubplotMirror | undefined

---

remove()

remove<T>(primitive): void;

Experimental

Type Parameters

Type Parameter
T

Parameters

Parameter	Type
primitive	Primitive<T>

Returns

void

---

subplotViewport()?

optional subplotViewport(key, options): Viewport;

Experimental

The 3D viewport of non-cartesian subplot key (M6: a 3D scene, 'scene', 'scene2', …; ADR-004): its own rect, perspective or orthographic camera and depth buffer (cleared first), drawn after the cartesian subplots and before the overlay. Created on the first call, shared by every trace and component that asks for the same key and updated with options on each call; removed (with what is still in it) after a draw pass in which nothing asked for it. Add primitives to it with add(primitive, viewport). Always set by the runtime; optional for hand-built contexts.

Parameters

Parameter	Type
key	string
options	SubplotViewportOptions

Returns

Viewport

---

traceModule()?

optional traceModule(type):
  | TraceModule<unknown, Children>
  | undefined;

Experimental

The registered module for a trace type (M1 wave 3), so components can ask traces for their colorbar / legendIcon. Always set by the runtime; optional for hand-built test contexts.

Parameters

Parameter	Type
type	string

Returns

| TraceModule<unknown, Children> | undefined