PieLayout, PieSlice, and PieLabel

Read as Markdown

PieLayout calculates geometry and label placements before rendering its function children once per source row. Import these components from @pibbl/core/viz.

Pass data, value, optional keyBy, and a label(slice) callback returning single-line text. Style accepts numeric cx, cy, radius, innerRadius, and labelGap, plus a Canvas font string labelFont; defaults use the current allocation. bounds defaults to that local allocation. Bounds constrain labels, not paint; compose core Clip if needed.

placement is outside (default), inside, or auto. Inside labels must fit in the sector and bounds; otherwise they are hidden. Auto moves non-fitting labels outside. Outside labels occupy separate left/right lanes, stay outside the whole disk, and preserve vertical anchor order. Leaders fan out immediately from slice midpoints, ending with a short horizontal segment beside the text. Each half packs labels away from the equator, respecting the circle tangent so leaders do not cross the pie. Labels that cannot fit are omitted deterministically. No font shrinking, sorting of data, or aggregation is implicit.

Each callback receives a PieLayoutSlice: original PieSliceGeometry fields, center, outer radius, innerRadius, and optional label. Labels expose status: "placed" with their box, baseline, and leader points, or status: "hidden" with reason empty, inside-fit, or space. Applications can provide a legend or other fallback.

PieSlice takes slice, normal Pibbl events/focus props, paint style, and optional children. PieLabel takes the same slice and renders its coordinated label and leader. Label font belongs to the chart’s measurement inputs; its paint style accepts fill, leaderStroke, and leaderWidth. Labels are decorative by default. Set pointerEvents="auto" and provide event handlers to make a label box selectable. Slice hit geometry never expands to include its label.

Donuts and label containment

innerRadius defaults to zero. For a nonzero radius require finite 0 <= innerRadius < radius; a zero radius permits only a zero inner radius. PieSlice paints and targets the same annular path. Its hole lets input reach underlying content, and the inner edge participates in ordinary stroke geometry.

The inside candidate lies on the angular bisector at innerRadius + 0.65 * (radius - innerRadius). The complete measured label box must fit the bounds, outer disk and conservative angular region, and its closest point to the center must remain outside the hole. Testing corners against the hole alone is insufficient. Tangency is allowed. The angular region uses at most a half-disk, so a wide slice can omit a label that a more expensive placement search might fit. No search, shrinking, clipping or movement into the hole is performed. Failed inside placement reports inside-fit; auto tries the outside lanes and reports space if those fail. Empty text or geometry reports empty. Outside leaders remain anchored to the outer radius.

Updates, caching and ownership

Data and chart style inputs accept core signals. By default, each PieLayout component evaluation reevaluates data/value/key/label callbacks; their stable identities do not prove their results unchanged. Plain mutation alone does not schedule Pibbl work. Signal reads inside callbacks are tracked dynamically. Callbacks cannot call hooks; return components for hooks.

Optional revision accepts a signal-capable nonnegative safe integer and opts into cached preprocessing. Change it whenever mutable data or nonreactive callback dependencies change, including captured variables, external lookup tables or loaded font metrics. Setting a data signal to the same array can be equality-suppressed; an independently changed revision signal schedules work. Data/accessor replacement and tracked signal changes also invalidate relevant work. Layout additionally depends on center/radii, bounds, font, gap, placement and label callback. Stable revision plus unchanged dependencies allows paint-only selection changes to reuse geometry and measurements.

import { signal } from "@pibbl/core";
import {
  PieLayout,
  PieSlice,
  PieLabel,
  type PieSliceGeometry,
} from "@pibbl/core/viz";

const rows = [
  { amount: 2, name: "North" },
  { amount: 3, name: "South" },
];
const label = (slice: PieSliceGeometry<(typeof rows)[number]>) =>
  slice.datum.name;
const revision = signal(0);
<PieLayout
  data={rows}
  value="amount"
  revision={revision}
  label={label}
  style={{ radius: 100, innerRadius: 55 }}
>
  {(slice) => (
    <PieSlice slice={slice}>
      <PieLabel slice={slice} />
    </PieSlice>
  )}
</PieLayout>;
// After an in-place edit outside render:
revision.update((value) => value + 1);

Geometry and label work is mount-owned and released on removal/disposal. A rebuild never publishes partial layout. Slice geometry is O(n); inside checks are O(1) per label, with outside packing O(n log n) sorting plus linear sweeps. The root still repaints ordinary paths. There is no separate renderer, frame loop, global cache or retained paint cache.

The label renderer supports single-line text. Load custom fonts before mounting or change revision when their metrics change. Multiline/custom label content and automatic legend generation remain separate capabilities.

API details from source

PieLayout

Computes pie geometry and label placement, then renders children for each resolved slice.

PieLayout: <D>(props: PieLayoutProps<D>) => JSX.Element[]

Related API: PieLayout, PieLayoutProps, JSX.

Parameters

props — Data, pie geometry, label policy, and child renderer. See PieLayoutProps.

Returns

Pibbl content arranged as pie slices.

PieSlice

Draws a resolved pie slice using wedge geometry and the supplied paint style.

PieSlice: <D>({ slice, style: input, children, ...events }: PieSliceProps<D>) => JSX.Element

Related API: PieSlice, PieSliceProps, JSX.

Parameters

props — Slice geometry, appearance, handlers, and children. See PieSliceProps.

Returns

Pibbl nodes drawing one pie slice and its children.

PieLabel

Draws a resolved slice label and optional leader line; decorative labels ignore pointer targeting by default.

PieLabel: <D>({ slice, style: input, pointerEvents, ...events }: PieLabelProps<D>) => JSX.Element | null

Related API: PieLabel, PieLabelProps, JSX.

Parameters

props — Slice geometry, label appearance, and interaction options. See PieLabelProps .

Returns

Pibbl content drawing the slice label, or null when the label was not placed.

PieLayoutProps

Authored inputs for PieLayout, including the declared data and presentation options.

interface PieLayoutProps<D> extends PieOptions<D>

Related API: PieLayoutProps, PieOptions.

Properties and methods

data

readonly data: SignalValue<readonly D[]>

Related API: SignalValue.

Application data supplied to the component or reported by the event. See SignalValue.

View source — packages/core/src/features/viz/lib/pie-types.ts:131

revision (optional)

readonly revision?: SignalValue<number> | undefined

Related API: SignalValue.

Opts into cached geometry for mutable inputs; advance after nonreactive changes.

View source — packages/core/src/features/viz/lib/pie-types.ts:133

label (optional)

readonly label?: ((slice: PieSliceGeometry<D>) => string) | undefined

Related API: PieSliceGeometry.

Formats the text associated with a pie slice. See PieSliceGeometry.

Parameters

slice — Slice whose label text is needed. See PieSliceGeometry.

Returns

Label text for the slice.

View source — packages/core/src/features/viz/lib/pie-types.ts:139

placement (optional)

readonly placement?: SignalValue<PieLabelPlacement> | undefined

Related API: SignalValue, PieLabelPlacement.

Preferred placement relative to the anchor or containing geometry. See SignalValue, PieLabelPlacement.

View source — packages/core/src/features/viz/lib/pie-types.ts:144

bounds (optional)

readonly bounds?: SignalValue<HoverBounds> | undefined

Related API: SignalValue, HoverBounds.

Logical region constraining the content or query. See SignalValue, HoverBounds.

View source — packages/core/src/features/viz/lib/pie-types.ts:149

style (optional)

readonly style?: SignalValue<Readonly<{ readonly cx?: SignalValue<number | undefined>; readonly cy?: SignalValue<number | undefined>; readonly radius?: SignalValue<number | undefined>; readonly innerRadius?: SignalValue<number | undefined>; readonly labelFont?: SignalValue<string | undefined>; readonly labelGap?: SignalValue<number | undefined>; }>> | undefined

Related API: SignalValue.

Declared presentation and layout properties. See SignalValue, SignalStyle, PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:154

children

readonly children: (slice: PieLayoutSlice<D>) => PibblNode

Related API: PieLayoutSlice, PibblNode.

Descendant content or the callback that supplies it. See PieLayoutSlice, PibblNode.

Parameters

slice — Slice geometry and layout metadata. See PieLayoutSlice.

Returns

Pibbl content representing the slice. See PibblNode.

View source — packages/core/src/features/viz/lib/pie-types.ts:161

value

readonly value: LineAccessor<D>

Related API: LineAccessor.

Value associated with this sample, input, or result. See LineAccessor.

View source — packages/core/src/features/viz/lib/pie-slices.ts:16

keyBy (optional)

readonly keyBy?: PlotKeyAccessor<D> | undefined

Related API: PlotKeyAccessor.

Property or callback supplying stable identity for each datum. See PlotKeyAccessor.

View source — packages/core/src/features/viz/lib/pie-slices.ts:18

PieLayoutStyle

Supported geometry and presentation properties for PieLayout.

interface PieLayoutStyle

Related API: PieLayoutStyle.

Properties and methods

cx (optional)

readonly cx?: number | undefined

Horizontal coordinate of the center. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:102

cy (optional)

readonly cy?: number | undefined

Vertical coordinate of the center. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:104

radius (optional)

readonly radius?: number | undefined

Radius in the coordinate system of this geometry or effect. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:106

innerRadius (optional)

readonly innerRadius?: number | undefined

Radius of the inner boundary. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:108

labelFont (optional)

readonly labelFont?: string | undefined

Canvas font used when measuring pie labels. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:110

labelGap (optional)

readonly labelGap?: number | undefined

Clearance between pie geometry and its labels. See PieLayoutStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:112

PieLayoutSlice

Pie-slice data extended with center, radii, and optional label placement.

interface PieLayoutSlice<D> extends PieSliceGeometry<D>

Related API: PieLayoutSlice, PieSliceGeometry.

Properties and methods

readonly cx: number

Horizontal coordinate of the center. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:85

readonly cy: number

Vertical coordinate of the center. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:87

radius

readonly radius: number

Radius in the coordinate system of this geometry or effect. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:89

innerRadius

readonly innerRadius: number

Radius of the inner boundary. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:91

label (optional)

readonly label?: PieLabelLayout | undefined

Related API: PieLabelLayout.

Resolved label placement, or a reason that the label is hidden. See PieLabelLayout.

View source — packages/core/src/features/viz/lib/pie-types.ts:93

datum

readonly datum: D

The original data item selected by this result. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:30

index

readonly index: number

Index of the selected datum in its source data. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:32

key

readonly key: string

Stable identity used by the containing protocol. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:34

value

readonly value: number

Value associated with this sample, input, or result. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:36

fraction

readonly fraction: number

Normalized share or position represented by this value. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:38

startAngle

readonly startAngle: number

Angle at which the arc or slice begins. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:40

endAngle

readonly endAngle: number

Angle at which the arc or slice ends. See PieSliceGeometry.

View source — packages/core/src/features/viz/lib/pie-slices.ts:42

PieLabelPlacement

Places pie labels inside, outside, or automatically according to available space.

type PieLabelPlacement = "inside" | "outside" | "auto"

Related API: PieLabelPlacement.

PieLabelLayout

A placed label with text geometry and optional leader, or a hidden label with its reason.

Full type declaration

type PieLabelLayout = | Readonly<{
      /** The literal "hidden" identifying this variant. See {@link PieLabelLayout}. */
      status: "hidden";
      /** Reason the operation could not produce its ordinary result. See {@link PieLabelLayout}. */
      reason: "empty" | "inside-fit" | "space";
      /** Text displayed by the placed label. See {@link PieLabelLayout}. */
      text: string;
    }>
  | Readonly<{
      /** The literal "placed" identifying this variant. See {@link PieLabelLayout}. */
      status: "placed";
      /**
       * Preferred placement relative to the anchor or containing geometry. See
       * {@link PieLabelLayout}.
       */
      placement: "inside" | "outside";
      /** Text displayed by the placed label. See {@link PieLabelLayout}. */
      text: string;
      /** Canvas font string used to draw or measure text. See {@link PieLabelLayout}. */
      font: string;
      /**
       * Horizontal coordinate or displacement in the containing coordinate system. See
       * {@link PieLabelLayout}.
       */
      x: number;
      /**
       * Vertical coordinate or displacement in the containing coordinate system. See
       * {@link PieLabelLayout}.
       */
      y: number;
      /**
       * Horizontal extent in the units of the containing geometry or surface. See
       * {@link PieLabelLayout}.
       */
      width: number;
      /**
       * Vertical extent in the units of the containing geometry or surface. See
       * {@link PieLabelLayout}.
       */
      height: number;
      /** Horizontal origin used to paint the placed label text. See {@link PieLabelLayout}. */
      textX: number;
      /** Vertical origin used to paint the placed label text. See {@link PieLabelLayout}. */
      textY: number;
      /** Ordered logical points of the label's leader line. See {@link PieLabelLayout}. */
      leader?: readonly (readonly [number, number])[];
    }>

Related API: PieLabelLayout, Text, Canvas, displacement, extent.

Properties and methods

status

status: "hidden" | "placed"

The literal “hidden” identifying this variant. See PieLabelLayout. The literal “placed” identifying this variant. See PieLabelLayout.

View source — packages/core/src/features/viz/lib/pie-types.ts:29

text

text: string

Text displayed by the placed label. See PieLabelLayout.

View source — packages/core/src/features/viz/lib/pie-types.ts:33

PieSliceProps

Authored inputs for PieSlice, including the declared data and presentation options.

interface PieSliceProps<D> extends WedgeProps

Related API: PieSliceProps, WedgeProps.

Properties and methods

slice

readonly slice: PieLayoutSlice<D>

Related API: PieLayoutSlice.

Resolved pie geometry and label placement to present. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:186

style (optional)

Full type declaration

readonly style?: SignalValue<Readonly<{ left?: SignalValue<number | `${number}%` | undefined>; top?: SignalValue<number | `${number}%` | undefined>; width?: SignalValue<Length | undefined>; height?: SignalValue<Length | undefined>; minWidth?: SignalValue<number | `${number}%` | undefined>; maxWidth?: SignalValue<number | `${number}%` | undefined>; minHeight?: SignalValue<number | `${number}%` | undefined>; maxHeight?: SignalValue<number | `${number}%` | undefined>; padding?: SignalValue<EdgeValues | undefined>; overflow?: SignalValue<"clip" | "visible" | undefined>; alignSelf?: SignalValue<"auto" | "center" | "end" | "flex-end" | "flex-start" | "start" | "stretch" | undefined>; justifySelf?: SignalValue<"auto" | "center" | "end" | "start" | "stretch" | undefined>; flexBasis?: SignalValue<Length | undefined>; flexGrow?: SignalValue<number | undefined>; flexShrink?: SignalValue<number | undefined>; gridColumnStart?: SignalValue<number | undefined>; gridColumnSpan?: SignalValue<number | undefined>; gridRowStart?: SignalValue<number | undefined>; gridRowSpan?: SignalValue<number | undefined>; fill?: SignalValue<FillStyle | undefined>; stroke?: SignalValue<StrokeStyle | undefined>; strokeWidth?: SignalValue<number | undefined>; opacity?: SignalValue<number | undefined>; cursor?: SignalValue<string | undefined>; transition?: SignalValue<PibblTransitionBinding | undefined>; custom?: unknown; filter?: SignalValue<PibblFilter | readonly PibblFilter[] | undefined>; lineInteractionWidth?: SignalValue<number | undefined>; }>> | undefined

Declared presentation and layout properties. See SignalValue, SignalStyle, PieSliceStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:191

children (optional)

readonly children?: PibblNode

Related API: PibblNode.

Descendant content or the callback that supplies it. See PibblNode.

View source — packages/core/src/features/viz/lib/pie-types.ts:193

pointerEvents (optional)

readonly pointerEvents?: PibblPointerEvents | undefined

Related API: PibblPointerEvents.

Whether this content participates in pointer targeting. See PibblPointerEvents.

View source — packages/core/src/lib/events/types.ts:126

keyboardFocusable (optional)

readonly keyboardFocusable?: boolean | undefined

Whether the target may receive keyboard focus. See PibblEventFocusOptions.

View source — packages/core/src/lib/events/types.ts:137

keyboardNavigationBounds (optional)

readonly keyboardNavigationBounds?: Readonly<LayoutBox> | undefined

Related API: LayoutBox.

Logical rectangle used for directional keyboard navigation. See LayoutBox.

View source — packages/core/src/lib/events/types.ts:139

physics (optional)

readonly physics?: PibblPhysicsAttachment2D | undefined

Related API: PibblPhysicsAttachment2D.

View source — packages/core/src/features/physics/lib/2d/types.ts:321

PieSliceStyle

Supported geometry and presentation properties for PieSlice.

type PieSliceStyle = Omit<
  WedgeStyle,
  "cx" | "cy" | "radius" | "startAngle" | "endAngle" | "counterclockwise"
>

Related API: PieSliceStyle, WedgeStyle.

Properties and methods

left (optional)

left?: number | `${number}%` | undefined

Left edge coordinate or inset. See Length.

View source — packages/core/src/lib/style/positioning.ts:127

top (optional)

top?: number | `${number}%` | undefined

Top edge value or top envelope guide. See Length.

View source — packages/core/src/lib/style/positioning.ts:129

width (optional)

width?: Length | undefined

Related API: Length.

Horizontal extent in the units of the containing geometry or surface. See Length.

View source — packages/core/src/lib/style/types.ts:81

height (optional)

height?: Length | undefined

Related API: Length.

Vertical extent in the units of the containing geometry or surface. See Length.

View source — packages/core/src/lib/style/types.ts:83

minWidth (optional)

minWidth?: number | `${number}%` | undefined

Minimum permitted width. See Length.

View source — packages/core/src/lib/style/types.ts:85

maxWidth (optional)

maxWidth?: number | `${number}%` | undefined

Maximum permitted width. See Length.

View source — packages/core/src/lib/style/types.ts:87

minHeight (optional)

minHeight?: number | `${number}%` | undefined

Minimum permitted height. See Length.

View source — packages/core/src/lib/style/types.ts:89

maxHeight (optional)

maxHeight?: number | `${number}%` | undefined

Maximum permitted height. See Length.

View source — packages/core/src/lib/style/types.ts:91

padding (optional)

padding?: EdgeValues | undefined

Related API: EdgeValues.

Insets between the border box and content box. See EdgeValues.

View source — packages/core/src/lib/style/types.ts:93

overflow (optional)

overflow?: "clip" | "visible" | undefined

Selects "visible", "clip" for overflow. See BoxStyle.

View source — packages/core/src/lib/style/types.ts:95

alignSelf (optional)

alignSelf?: "auto" | "center" | "end" | "flex-end" | "flex-start" | "start" | "stretch" | undefined

This child’s cross-axis or block-axis alignment override. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:121

justifySelf (optional)

justifySelf?: "auto" | "center" | "end" | "start" | "stretch" | undefined

This child’s inline-axis alignment override. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:123

flexBasis (optional)

flexBasis?: Length | undefined

Related API: Length.

Initial main-axis size before flex growth or shrinkage. See Length.

View source — packages/core/src/lib/style/types.ts:125

flexGrow (optional)

flexGrow?: number | undefined

Relative share of positive free space assigned to this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:127

flexShrink (optional)

flexShrink?: number | undefined

Relative factor used when reducing main-axis size. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:129

gridColumnStart (optional)

gridColumnStart?: number | undefined

Explicit starting grid column. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:131

gridColumnSpan (optional)

gridColumnSpan?: number | undefined

Number of columns occupied by this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:133

gridRowStart (optional)

gridRowStart?: number | undefined

Explicit starting grid row. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:135

gridRowSpan (optional)

gridRowSpan?: number | undefined

Number of rows occupied by this child. See LayoutItemStyle.

View source — packages/core/src/lib/style/types.ts:137

fill (optional)

fill?: FillStyle | undefined

Related API: FillStyle.

Paint used for the interior. See FillStyle.

View source — packages/core/src/lib/style/types.ts:193

stroke (optional)

stroke?: StrokeStyle | undefined

Related API: StrokeStyle.

Paint used for the outline. See StrokeStyle.

View source — packages/core/src/lib/style/types.ts:195

strokeWidth (optional)

strokeWidth?: number | undefined

Width of the painted outline. See PaintStyle.

View source — packages/core/src/lib/style/types.ts:197

opacity (optional)

opacity?: number | undefined

Related API: opacity.

Opacity of the painted result. See PaintStyle.

View source — packages/core/src/lib/style/types.ts:199

cursor (optional)

cursor?: string | undefined

Cursor shown while this target owns pointer presentation. See CursorStyle.

View source — packages/core/src/lib/style/types.ts:212

transition (optional)

transition?: PibblTransitionBinding | undefined

Related API: PibblTransitionBinding.

Visibility-transition binding applied to this primitive and its captured descendants. See SystemStyle.

View source — packages/core/src/lib/types.ts:69

custom (optional)

custom?: unknown

Application-defined style payload passed through the runtime. See SystemStyle.

View source — packages/core/src/lib/types.ts:71

filter (optional)

filter?: PibblFilter | readonly PibblFilter[] | undefined

Related API: PibblFilter.

Ordered pixel-only filters applied to the receiving primitive and its descendants. See PibblFilter.

View source — packages/core/src/lib/types.ts:76

lineInteractionWidth (optional)

lineInteractionWidth?: number | undefined

Width used for line hit testing independently of the visible stroke width. See WedgeStyle.

View source — packages/core/src/lib/components/wedge.ts:73

PieLabelProps

Authored inputs for PieLabel, including the declared data and presentation options.

interface PieLabelProps<D> extends PibblEventHandlers, PibblEventParticipationOptions

Properties and methods

slice

readonly slice: PieLayoutSlice<D>

Related API: PieLayoutSlice.

Resolved pie geometry and label placement to present. See PieLayoutSlice.

View source — packages/core/src/features/viz/lib/pie-types.ts:223

style (optional)

readonly style?: SignalValue<Readonly<{ readonly fill?: SignalValue<FillStyle | undefined>; readonly leaderStroke?: SignalValue<StrokeStyle | undefined>; readonly leaderWidth?: SignalValue<number | undefined>; }>> | undefined

Related API: SignalValue, FillStyle, StrokeStyle.

Declared presentation and layout properties. See SignalValue, SignalStyle, PieLabelStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:228

pointerEvents (optional)

readonly pointerEvents?: PibblPointerEvents | undefined

Related API: PibblPointerEvents.

Whether this content participates in pointer targeting. See PibblPointerEvents.

View source — packages/core/src/lib/events/types.ts:126

PieLabelStyle

Supported geometry and presentation properties for PieLabel.

interface PieLabelStyle

Related API: PieLabelStyle.

Properties and methods

fill (optional)

readonly fill?: FillStyle | undefined

Related API: FillStyle.

Paint used for the interior. See FillStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:204

leaderStroke (optional)

readonly leaderStroke?: StrokeStyle | undefined

Related API: StrokeStyle.

Paint used for a pie label’s leader line. See StrokeStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:206

leaderWidth (optional)

readonly leaderWidth?: number | undefined

Stroke width of a pie label’s leader line. See PieLabelStyle.

View source — packages/core/src/features/viz/lib/pie-types.ts:208

Implementation guidance for agents

Read the Data visualization companion for ownership, adaptation, failure modes, and verification. Agent start provides the version-selection workflow.

Complete minimal examples

Pie chart composition: Compute pie geometry and render labeled donut slices. Plain source

Documentation version

Documentation built with @pibbl/core 0.0.2, revision 380919b. ALPHA — NOT FOR PRODUCTION USE.

PieLayout, PieSlice, and PieLabel

Donuts and label containment

Updates, caching and ownership

API details from source

PieLayout

Parameters

Returns

See also

PieSlice

Parameters

Returns

See also

PieLabel

Parameters

Returns

See also

PieLayoutProps

See also

Properties and methods

Parameters

Returns

Parameters

Returns

PieLayoutStyle

See also

Properties and methods

PieLayoutSlice

See also

Properties and methods

PieLabelPlacement

See also

PieLabelLayout

See also

Properties and methods

PieSliceProps

See also

Properties and methods

PieSliceStyle

See also

Properties and methods

PieLabelProps

See also

Properties and methods

PieLabelStyle

See also

Properties and methods

Implementation guidance for agents

Complete minimal examples

Documentation version