@motionscript/charts 0.1.0-alpha.5 → 0.1.0-alpha.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +22 -0
- package/README.md +30 -16
- package/dist/bar-chart/bar-chart.d.ts +93 -246
- package/dist/bar-chart/bar-chart.d.ts.map +1 -1
- package/dist/bar-chart/bar-chart.js +378 -569
- package/dist/bar-chart/bar-chart.js.map +1 -1
- package/dist/bar-chart/category-axis.d.ts +24 -41
- package/dist/bar-chart/category-axis.d.ts.map +1 -1
- package/dist/bar-chart/category-axis.js +93 -115
- package/dist/bar-chart/category-axis.js.map +1 -1
- package/dist/bar-chart/chart-bars.d.ts +36 -70
- package/dist/bar-chart/chart-bars.d.ts.map +1 -1
- package/dist/bar-chart/chart-bars.js +156 -210
- package/dist/bar-chart/chart-bars.js.map +1 -1
- package/dist/bar-chart/index.d.ts +2 -2
- package/dist/bar-chart/index.d.ts.map +1 -1
- package/dist/bar-chart/index.js +1 -1
- package/dist/bar-chart/index.js.map +1 -1
- package/dist/bar-chart/shared.d.ts +3 -3
- package/dist/bar-chart/shared.d.ts.map +1 -1
- package/dist/bar-chart/shared.js +3 -3
- package/dist/bar-chart/shared.js.map +1 -1
- package/dist/browser/chunks/chunk-XROBIRQK.js +2 -0
- package/dist/browser/chunks/chunk-XROBIRQK.js.map +7 -0
- package/dist/browser/index.js +1 -1
- package/dist/browser/index.js.map +3 -3
- package/dist/browser/kit.js +1 -1
- package/dist/browser/manifest.json +1 -1
- package/dist/engine.d.ts +8 -6
- package/dist/engine.d.ts.map +1 -1
- package/dist/engine.js +8 -6
- package/dist/engine.js.map +1 -1
- package/dist/kit/cartesian.d.ts +44 -0
- package/dist/kit/cartesian.d.ts.map +1 -0
- package/dist/kit/cartesian.js +59 -0
- package/dist/kit/cartesian.js.map +1 -0
- package/dist/kit/chart-border.d.ts +8 -11
- package/dist/kit/chart-border.d.ts.map +1 -1
- package/dist/kit/chart-border.js +15 -32
- package/dist/kit/chart-border.js.map +1 -1
- package/dist/kit/chart-canvas.d.ts +23 -21
- package/dist/kit/chart-canvas.d.ts.map +1 -1
- package/dist/kit/chart-canvas.js +33 -90
- package/dist/kit/chart-canvas.js.map +1 -1
- package/dist/kit/chart-legend.d.ts +79 -67
- package/dist/kit/chart-legend.d.ts.map +1 -1
- package/dist/kit/chart-legend.js +129 -154
- package/dist/kit/chart-legend.js.map +1 -1
- package/dist/kit/entries.d.ts +17 -0
- package/dist/kit/entries.d.ts.map +1 -0
- package/dist/kit/entries.js +19 -0
- package/dist/kit/entries.js.map +1 -0
- package/dist/kit/motion.d.ts +48 -0
- package/dist/kit/motion.d.ts.map +1 -0
- package/dist/kit/motion.js +63 -0
- package/dist/kit/motion.js.map +1 -0
- package/dist/kit/paints.d.ts +10 -0
- package/dist/kit/paints.d.ts.map +1 -0
- package/dist/kit/paints.js +12 -0
- package/dist/kit/paints.js.map +1 -0
- package/dist/kit/shared.d.ts +31 -3
- package/dist/kit/shared.d.ts.map +1 -1
- package/dist/kit/shared.js +42 -3
- package/dist/kit/shared.js.map +1 -1
- package/dist/kit/vertical-axis.d.ts +36 -61
- package/dist/kit/vertical-axis.d.ts.map +1 -1
- package/dist/kit/vertical-axis.js +97 -132
- package/dist/kit/vertical-axis.js.map +1 -1
- package/dist/line-chart/chart-line.d.ts +25 -51
- package/dist/line-chart/chart-line.d.ts.map +1 -1
- package/dist/line-chart/chart-line.js +89 -120
- package/dist/line-chart/chart-line.js.map +1 -1
- package/dist/line-chart/chart-region.d.ts +14 -14
- package/dist/line-chart/chart-region.d.ts.map +1 -1
- package/dist/line-chart/chart-region.js +26 -64
- package/dist/line-chart/chart-region.js.map +1 -1
- package/dist/line-chart/horizontal-axis.d.ts +32 -56
- package/dist/line-chart/horizontal-axis.d.ts.map +1 -1
- package/dist/line-chart/horizontal-axis.js +85 -123
- package/dist/line-chart/horizontal-axis.js.map +1 -1
- package/dist/line-chart/index.d.ts +2 -2
- package/dist/line-chart/index.d.ts.map +1 -1
- package/dist/line-chart/index.js +1 -1
- package/dist/line-chart/index.js.map +1 -1
- package/dist/line-chart/line-chart.d.ts +111 -319
- package/dist/line-chart/line-chart.d.ts.map +1 -1
- package/dist/line-chart/line-chart.js +403 -663
- package/dist/line-chart/line-chart.js.map +1 -1
- package/dist/line-chart/shared.d.ts +3 -3
- package/dist/line-chart/shared.d.ts.map +1 -1
- package/dist/line-chart/shared.js +3 -3
- package/dist/line-chart/shared.js.map +1 -1
- package/dist/nodes.d.ts +6 -9
- package/dist/nodes.d.ts.map +1 -1
- package/dist/nodes.js +7 -9
- package/dist/nodes.js.map +1 -1
- package/dist/pie-chart/index.d.ts +2 -2
- package/dist/pie-chart/index.d.ts.map +1 -1
- package/dist/pie-chart/index.js +1 -1
- package/dist/pie-chart/index.js.map +1 -1
- package/dist/pie-chart/pie-chart.d.ts +77 -134
- package/dist/pie-chart/pie-chart.d.ts.map +1 -1
- package/dist/pie-chart/pie-chart.js +200 -271
- package/dist/pie-chart/pie-chart.js.map +1 -1
- package/dist/pie-chart/pie-legend.d.ts +54 -31
- package/dist/pie-chart/pie-legend.d.ts.map +1 -1
- package/dist/pie-chart/pie-legend.js +93 -107
- package/dist/pie-chart/pie-legend.js.map +1 -1
- package/dist/pie-chart/pie-ring.d.ts +142 -131
- package/dist/pie-chart/pie-ring.d.ts.map +1 -1
- package/dist/pie-chart/pie-ring.js +333 -391
- package/dist/pie-chart/pie-ring.js.map +1 -1
- package/package.json +4 -4
- package/src/bar-chart/bar-chart.ts +415 -701
- package/src/bar-chart/category-axis.ts +95 -110
- package/src/bar-chart/chart-bars.ts +178 -200
- package/src/bar-chart/index.ts +2 -2
- package/src/bar-chart/shared.ts +3 -3
- package/src/engine.ts +8 -6
- package/src/kit/cartesian.ts +81 -0
- package/src/kit/chart-border.ts +22 -33
- package/src/kit/chart-canvas.ts +44 -79
- package/src/kit/chart-legend.ts +173 -189
- package/src/kit/entries.ts +20 -0
- package/src/kit/motion.ts +90 -0
- package/src/kit/paints.ts +15 -0
- package/src/kit/shared.ts +52 -3
- package/src/kit/vertical-axis.ts +110 -140
- package/src/line-chart/chart-line.ts +95 -122
- package/src/line-chart/chart-region.ts +30 -59
- package/src/line-chart/horizontal-axis.ts +99 -135
- package/src/line-chart/index.ts +2 -2
- package/src/line-chart/line-chart.ts +449 -825
- package/src/line-chart/shared.ts +3 -3
- package/src/nodes.ts +8 -10
- package/src/pie-chart/index.ts +2 -2
- package/src/pie-chart/pie-chart.ts +221 -311
- package/src/pie-chart/pie-legend.ts +124 -114
- package/src/pie-chart/pie-ring.ts +386 -473
- package/dist/browser/chunks/chunk-5ZPBV6BU.js +0 -2
- package/dist/browser/chunks/chunk-5ZPBV6BU.js.map +0 -7
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
import { type CenterConfig, type LabelConfig, type PieLabelMode, type PieLabelPlacement, type PieSlice, type RingConfig } from "./shared.js";
|
|
1
|
+
import { type FillResolved, type NodeOf, type Node2D, type Node2DProps, type Vector2 } from "@motionscript/sdk";
|
|
2
|
+
import { type CenterConfig, type LabelConfig, type PieArc, type PieLabelMode, type PieLabelPlacement, type PieSlice, type RingConfig } from "./shared.js";
|
|
3
3
|
export interface PieRingProps extends Node2DProps {
|
|
4
4
|
/** One entry per slice: its `category`, `value` and `fill`. */
|
|
5
5
|
slices: PieSlice[];
|
|
@@ -52,80 +52,47 @@ export interface PieRingProps extends Node2DProps {
|
|
|
52
52
|
*/
|
|
53
53
|
centerReveal: number;
|
|
54
54
|
}
|
|
55
|
+
/** Where one slice's label sits and the polyline that points at it. */
|
|
56
|
+
interface LabelPlacement {
|
|
57
|
+
/** Index of the slice. */
|
|
58
|
+
index: number;
|
|
59
|
+
/** Which side of the ring the label sits on: +1 right, −1 left. */
|
|
60
|
+
side: 1 | -1;
|
|
61
|
+
/** Leader polyline: wedge edge → elbow → label. */
|
|
62
|
+
leader: Vector2[];
|
|
63
|
+
/** Point the label's inner edge is pinned to. */
|
|
64
|
+
text: Vector2;
|
|
65
|
+
}
|
|
66
|
+
/** What the ring's geometry reads off its entries. */
|
|
67
|
+
interface RingState {
|
|
68
|
+
readonly slices: PieSlice[];
|
|
69
|
+
readonly ring: RingConfig;
|
|
70
|
+
readonly label: LabelConfig;
|
|
71
|
+
readonly centerStyle: CenterConfig;
|
|
72
|
+
readonly labelMode: PieLabelMode;
|
|
73
|
+
readonly labelPlacement: PieLabelPlacement;
|
|
74
|
+
readonly pops: readonly number[];
|
|
75
|
+
readonly dimOpacity: number;
|
|
76
|
+
readonly centerLabel: string;
|
|
77
|
+
readonly centerCaption: string;
|
|
78
|
+
}
|
|
55
79
|
/**
|
|
56
|
-
* The ring
|
|
57
|
-
*
|
|
58
|
-
*
|
|
59
|
-
*
|
|
60
|
-
* while its hole edge stays put — so it reads as that band swelling out of the
|
|
61
|
-
* ring rather than breaking off it — and the rest of the ring dims behind it,
|
|
62
|
-
* leaders and labels included.
|
|
63
|
-
*
|
|
64
|
-
* This is the only part of the chart family that draws a path: the wedges are
|
|
65
|
-
* filled {@link PathBuilder} polygons approximating each arc, and the leaders are
|
|
66
|
-
* stroked polylines — both in the node's centred, y-up space, so neither depends
|
|
67
|
-
* on SVG arc-sweep conventions. The **labels are real {@link Text} nodes**
|
|
68
|
-
* (stacked in a hug vertical flow and pinned by their inner edge), so no
|
|
69
|
-
* glyph-width guesswork decides where a caption starts.
|
|
70
|
-
*
|
|
71
|
-
* ### Label placement
|
|
72
|
-
* Each label sits either **inside** its wedge or **outside** on a leader.
|
|
73
|
-
*
|
|
74
|
-
* An inside label is centred on its slice's band and leads with the number, the
|
|
75
|
-
* caption set small underneath — inside a wedge the reader already knows which
|
|
76
|
-
* slice they're on, so the magnitude is the thing being read. It costs no gutter
|
|
77
|
-
* and no eye round-trip, so a ring labelled that way draws considerably bigger in
|
|
78
|
-
* the same box.
|
|
79
|
-
*
|
|
80
|
-
* A leader label sits outside on the end of a polyline that lifts off its wedge,
|
|
81
|
-
* elbows, and runs horizontally into the text. Labels are split into a left and a
|
|
82
|
-
* right column by which way their slice's bisector points, and each column is
|
|
83
|
-
* de-conflicted independently (see {@link relaxLabels}): a label takes the spot
|
|
84
|
-
* nearest its wedge that still clears its neighbour, and the column is squeezed
|
|
85
|
-
* to fit the node's height rather than spilling out of it. The elbow then rides on
|
|
86
|
-
* a circle just outside the ring **at the label's settled y**, so the run into the
|
|
87
|
-
* text is always horizontal and a nudged label never drags its leader back across
|
|
88
|
-
* the ring.
|
|
89
|
-
*
|
|
90
|
-
* Only the sides that actually carry a leader reserve a gutter, and the ring's
|
|
91
|
-
* centre slides into whatever the other side left over ({@link centerX}) — so a
|
|
92
|
-
* ring whose slices all leader one way doesn't leave a bald patch on the other.
|
|
80
|
+
* The ring's geometry for one box: every radius, gutter and label position,
|
|
81
|
+
* derived from the entries and the size the ring was laid out at, and asked
|
|
82
|
+
* afresh wherever it is read — the drawing, and the labels' bound positions
|
|
83
|
+
* and sizes alike, so the two cannot disagree.
|
|
93
84
|
*/
|
|
94
|
-
export declare class
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
growth: number;
|
|
102
|
-
labelReveal: number;
|
|
103
|
-
pops: number[];
|
|
104
|
-
dimOpacity: number;
|
|
105
|
-
centerLabel: string;
|
|
106
|
-
centerCaption: string;
|
|
107
|
-
centerReveal: number;
|
|
108
|
-
/**
|
|
109
|
-
* Each slice's fill, resolved when it changes rather than every frame: the
|
|
110
|
-
* slices are bound to the chart's rows and palette, so a theme tween hands
|
|
111
|
-
* over new paint and `renderSelf` must see it, but a frame that moves nothing
|
|
112
|
-
* must not re-resolve.
|
|
113
|
-
*/
|
|
114
|
-
private fillCache;
|
|
115
|
-
private get resolvedFills();
|
|
116
|
-
constructor(props?: NodeConfig<PieRing, PieRingProps>);
|
|
117
|
-
/** Build slice `arc`'s label, in whichever form the chart's placement asks for. */
|
|
118
|
-
private addLabel;
|
|
119
|
-
/** Slice `index`'s share of the ring as its label reads it, off the live values. */
|
|
120
|
-
private percentText;
|
|
121
|
-
/** Build the hole's summary block. */
|
|
122
|
-
private addCenterLabel;
|
|
85
|
+
export declare class RingGeometry {
|
|
86
|
+
private readonly s;
|
|
87
|
+
private readonly box;
|
|
88
|
+
constructor(s: RingState, box: {
|
|
89
|
+
readonly width: number;
|
|
90
|
+
readonly height: number;
|
|
91
|
+
});
|
|
123
92
|
/** The drawn slices' angular spans, re-read every frame so a value tween re-cuts them. */
|
|
124
|
-
|
|
125
|
-
/** Which side a leader off bisector `mid` runs to: +1 right, −1 left. */
|
|
126
|
-
private sideOf;
|
|
93
|
+
get arcs(): PieArc[];
|
|
127
94
|
/** Whether any slice is labelled on a leader — the only thing that costs a gutter. */
|
|
128
|
-
|
|
95
|
+
get hasLeaderLabels(): boolean;
|
|
129
96
|
/**
|
|
130
97
|
* How wide a horizontal label centred in slice `arc`'s band can run before it
|
|
131
98
|
* leaves the wedge, in px.
|
|
@@ -142,9 +109,9 @@ export declare class PieRing extends Node2D<PieRingProps> {
|
|
|
142
109
|
* Measured off the *unpopped* radius, so a slice growing out of the ring
|
|
143
110
|
* doesn't resize its own text mid-animation.
|
|
144
111
|
*/
|
|
145
|
-
|
|
112
|
+
insideRoom(arc: PieArc): number;
|
|
146
113
|
/** Widest line, in glyphs at the leading line's size, an inside label runs to. */
|
|
147
|
-
|
|
114
|
+
insideGlyphs(arc: PieArc): number;
|
|
148
115
|
/**
|
|
149
116
|
* Font size of an inside label's leading line: what the theme asked for,
|
|
150
117
|
* shrunk if that wouldn't fit inside its wedge. **One size across every inside
|
|
@@ -154,24 +121,22 @@ export declare class PieRing extends Node2D<PieRingProps> {
|
|
|
154
121
|
* So the theme's `insideStyle.fontSize` is an upper bound, not a promise: ask
|
|
155
122
|
* for the size the chart wants and the ring keeps it legal.
|
|
156
123
|
*/
|
|
157
|
-
|
|
158
|
-
/** Whether the hole carries a summary at all. */
|
|
159
|
-
private get hasCenterLabel();
|
|
124
|
+
get insideFont(): number;
|
|
160
125
|
/**
|
|
161
126
|
* Font size of the hole's summary: the configured size, capped so it still
|
|
162
127
|
* fits across the hole. The cap matters because the hole's radius derives from
|
|
163
128
|
* the box, so a chart that reflows smaller would otherwise push its summary out
|
|
164
129
|
* through the ring.
|
|
165
130
|
*/
|
|
166
|
-
|
|
131
|
+
get centerFont(): number;
|
|
167
132
|
/** Rim radius of a fully selected slice as a multiple of the ring's, clamped sane. */
|
|
168
|
-
|
|
133
|
+
get growFactor(): number;
|
|
169
134
|
/** How far past the ring's rim a fully selected slice reaches, in px. */
|
|
170
|
-
|
|
135
|
+
get maxPop(): number;
|
|
171
136
|
/** Height of one **leader** label block, in px — the unit those columns are spaced by. */
|
|
172
|
-
|
|
137
|
+
get labelRowHeight(): number;
|
|
173
138
|
/** Widest line, in glyphs, that a leader label for slice `index` can run to. */
|
|
174
|
-
|
|
139
|
+
captionGlyphs(index: number): number;
|
|
175
140
|
/**
|
|
176
141
|
* Horizontal room reserved on each side for the leaders and their labels, in
|
|
177
142
|
* px — measured **per side**, from the slices that actually leader out that
|
|
@@ -180,51 +145,56 @@ export declare class PieRing extends Node2D<PieRingProps> {
|
|
|
180
145
|
* Excludes the ring's own selection-growth allowance, which scales with the
|
|
181
146
|
* radius and so is divided out in {@link outerRadius} instead.
|
|
182
147
|
*/
|
|
183
|
-
|
|
148
|
+
get labelGutters(): {
|
|
149
|
+
left: number;
|
|
150
|
+
right: number;
|
|
151
|
+
};
|
|
184
152
|
/**
|
|
185
153
|
* How far the ring's centre sits from the node's, in px. Zero while the
|
|
186
154
|
* gutters match; when the labels all fall one way it slides the ring into the
|
|
187
155
|
* empty half so the ring-plus-labels group stays centred in the box instead of
|
|
188
156
|
* the ring sitting dead centre with a bald patch beside it.
|
|
189
157
|
*/
|
|
190
|
-
|
|
158
|
+
get centerX(): number;
|
|
191
159
|
/**
|
|
192
160
|
* Radius of the ring's outer edge, fitted to whatever the label gutters leave.
|
|
193
161
|
* A fully selected slice reaches `radius × growFactor`, so the room has to
|
|
194
162
|
* cover that — hence the divisor, which keeps even the grown slice inside the
|
|
195
163
|
* box (and holds the ring the same size whether or not anything is selected).
|
|
196
164
|
*/
|
|
197
|
-
|
|
165
|
+
get outerRadius(): number;
|
|
198
166
|
/** Radius of the hole in the middle: a fraction of the outer radius, or explicit px. */
|
|
199
|
-
|
|
167
|
+
get holeRadius(): number;
|
|
200
168
|
/** Radius of the circle every leader elbows on, clear of even a popped-out slice. */
|
|
201
|
-
|
|
169
|
+
get elbowRadius(): number;
|
|
202
170
|
/** How far slice `index` is currently pushed out, in `[0, 1]`. */
|
|
203
|
-
|
|
171
|
+
popOf(index: number): number;
|
|
204
172
|
/** Radius of slice `index`'s outer edge, its selection growth included. */
|
|
205
|
-
|
|
173
|
+
anchorRadius(index: number): number;
|
|
206
174
|
/**
|
|
207
175
|
* Radius an inside label sits at on slice `index`: halfway across the band on a
|
|
208
176
|
* donut, and further out than halfway on a solid pie, where "halfway" would
|
|
209
177
|
* crowd the point every wedge converges on. Rides the slice's own pop, so an
|
|
210
178
|
* inside label travels out with the wedge it belongs to.
|
|
211
179
|
*/
|
|
212
|
-
|
|
213
|
-
/**
|
|
214
|
-
|
|
180
|
+
bandMidRadius(index: number): number;
|
|
181
|
+
/** The point slice `index`'s inside label is centred on. */
|
|
182
|
+
insideAnchor(index: number): Vector2;
|
|
215
183
|
/**
|
|
216
184
|
* How selected the ring is overall, in `[0, 1]` — the most-grown slice. Rides
|
|
217
185
|
* the same tween the pops do, so the dim below arrives with the growth rather
|
|
218
186
|
* than needing an animation of its own.
|
|
219
187
|
*/
|
|
220
|
-
|
|
188
|
+
get selectionStrength(): number;
|
|
221
189
|
/**
|
|
222
190
|
* Opacity slice `index` (and its leader and label) is drawn at: full while
|
|
223
|
-
* nothing is selected, falling toward
|
|
191
|
+
* nothing is selected, falling toward `dimOpacity` in proportion to how
|
|
224
192
|
* selected the *rest* of the ring is. A slice that's selected itself stays at
|
|
225
193
|
* full — the two factors cancel.
|
|
226
194
|
*/
|
|
227
|
-
|
|
195
|
+
sliceOpacity(index: number): number;
|
|
196
|
+
/** Slice `index`'s share of the ring as its label reads it, off the live values. */
|
|
197
|
+
percentText(index: number): string;
|
|
228
198
|
/**
|
|
229
199
|
* Where every leader label sits and how its leader gets there. Labels are split
|
|
230
200
|
* into a right and a left column by their slice's bisector, each column is
|
|
@@ -233,43 +203,84 @@ export declare class PieRing extends Node2D<PieRingProps> {
|
|
|
233
203
|
* the label's *settled* y, which keeps the final run horizontal and the whole
|
|
234
204
|
* polyline outside the ring however far the label was nudged.
|
|
235
205
|
*/
|
|
236
|
-
|
|
206
|
+
placements(): LabelPlacement[];
|
|
237
207
|
/** This frame's placement for slice `index`, or `undefined` if it isn't leadered. */
|
|
238
|
-
|
|
239
|
-
/**
|
|
240
|
-
* The ring's paints live nowhere `ShapeNode` would look: one fill per slice,
|
|
241
|
-
* resolved once into {@link fills}, the wedge outline and drop shadow of
|
|
242
|
-
* {@link ring}, and the leader line's own stroke. All are passed explicitly —
|
|
243
|
-
* see {@link declarePaints}.
|
|
244
|
-
*/
|
|
245
|
-
declareAssets(assets: AssetScope): void;
|
|
246
|
-
protected renderSelf(ctx: RenderContext2D): void;
|
|
247
|
-
/** Tween {@link growth} `0 → 1`, wiping the wedges in around the ring. */
|
|
248
|
-
sweep(args: CommandArgs<Record<string, never>> & {
|
|
249
|
-
duration: number;
|
|
250
|
-
}): Command<RingSweep>;
|
|
251
|
-
/** Tween {@link labelReveal} `0 → 1`, fading the leaders and captions up. */
|
|
252
|
-
revealLabels(args: CommandArgs<Record<string, never>> & {
|
|
253
|
-
duration: number;
|
|
254
|
-
}): Command<RingLabels>;
|
|
255
|
-
/**
|
|
256
|
-
* Fade the hole's summary up. Deliberately not part of the ring's entrance: a
|
|
257
|
-
* hole label is usually the chart's conclusion, so the scene decides when it
|
|
258
|
-
* lands.
|
|
259
|
-
*/
|
|
260
|
-
revealCenter(args?: CommandArgs<Record<string, never>> & {
|
|
261
|
-
duration?: number;
|
|
262
|
-
}): Command<RingCenter>;
|
|
208
|
+
placementFor(index: number): LabelPlacement | undefined;
|
|
263
209
|
}
|
|
264
|
-
/**
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
}
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
210
|
+
/** Each slice's fill, resolved. */
|
|
211
|
+
export declare function ringFills(slices: readonly PieSlice[]): FillResolved[][];
|
|
212
|
+
/**
|
|
213
|
+
* The ring itself: one wedge per {@link PieSlice}, sized by its share of the
|
|
214
|
+
* total, swept clockwise from the theme's `startAngle` with a `gap` of clear
|
|
215
|
+
* space between neighbours — a *constant-width* channel, the same at the hole as
|
|
216
|
+
* at the rim (see {@link wedgePath}). A **selected** slice reaches further out
|
|
217
|
+
* while its hole edge stays put — so it reads as that band swelling out of the
|
|
218
|
+
* ring rather than breaking off it — and the rest of the ring dims behind it,
|
|
219
|
+
* leaders and labels included.
|
|
220
|
+
*
|
|
221
|
+
* This is the only part of the chart family that draws a path: the wedges are
|
|
222
|
+
* filled {@link PathBuilder} polygons approximating each arc, and the leaders are
|
|
223
|
+
* stroked polylines — both in the node's centred, y-up space, so neither depends
|
|
224
|
+
* on SVG arc-sweep conventions. The **labels are real {@link Text} nodes**
|
|
225
|
+
* (stacked in a hug vertical flow and pinned by their inner edge), so no
|
|
226
|
+
* glyph-width guesswork decides where a caption starts.
|
|
227
|
+
*
|
|
228
|
+
* ### Label placement
|
|
229
|
+
* Each label sits either **inside** its wedge or **outside** on a leader.
|
|
230
|
+
*
|
|
231
|
+
* An inside label is centred on its slice's band and leads with the number, the
|
|
232
|
+
* caption set small underneath — inside a wedge the reader already knows which
|
|
233
|
+
* slice they're on, so the magnitude is the thing being read. It costs no gutter
|
|
234
|
+
* and no eye round-trip, so a ring labelled that way draws considerably bigger in
|
|
235
|
+
* the same box.
|
|
236
|
+
*
|
|
237
|
+
* A leader label sits outside on the end of a polyline that lifts off its wedge,
|
|
238
|
+
* elbows, and runs horizontally into the text. Labels are split into a left and a
|
|
239
|
+
* right column by which way their slice's bisector points, and each column is
|
|
240
|
+
* de-conflicted independently (see {@link relaxLabels}): a label takes the spot
|
|
241
|
+
* nearest its wedge that still clears its neighbour, and the column is squeezed
|
|
242
|
+
* to fit the node's height rather than spilling out of it. The elbow then rides on
|
|
243
|
+
* a circle just outside the ring **at the label's settled y**, so the run into the
|
|
244
|
+
* text is always horizontal and a nudged label never drags its leader back across
|
|
245
|
+
* the ring.
|
|
246
|
+
*
|
|
247
|
+
* Only the sides that actually carry a leader reserve a gutter, and the ring's
|
|
248
|
+
* centre slides into whatever the other side left over — so a ring whose slices
|
|
249
|
+
* all leader one way doesn't leave a bald patch on the other.
|
|
250
|
+
*/
|
|
251
|
+
export declare const PieRing: import("@motionscript/sdk").Component<"pieRing", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
|
|
252
|
+
readonly slices: import("@motionscript/sdk").Type<PieSlice[], PieSlice[], false>;
|
|
253
|
+
readonly ring: import("@motionscript/sdk").Type<RingConfig, RingConfig, false>;
|
|
254
|
+
readonly label: import("@motionscript/sdk").Type<LabelConfig, LabelConfig, false>;
|
|
255
|
+
readonly centerStyle: import("@motionscript/sdk").Type<CenterConfig, CenterConfig, false>;
|
|
256
|
+
readonly labelMode: import("@motionscript/sdk").Type<PieLabelMode, PieLabelMode, false>;
|
|
257
|
+
readonly labelPlacement: import("@motionscript/sdk").Type<PieLabelPlacement, PieLabelPlacement, false>;
|
|
258
|
+
readonly growth: 1;
|
|
259
|
+
readonly labelReveal: 1;
|
|
260
|
+
readonly pops: import("@motionscript/sdk").Type<number[], number[], false>;
|
|
261
|
+
readonly dimOpacity: number;
|
|
262
|
+
readonly centerLabel: "";
|
|
263
|
+
readonly centerCaption: "";
|
|
264
|
+
readonly centerReveal: 1;
|
|
265
|
+
}>, {
|
|
266
|
+
readonly sweep: unknown;
|
|
267
|
+
readonly revealLabels: unknown;
|
|
268
|
+
readonly revealCenter: unknown;
|
|
269
|
+
}, null, Node2D<Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
|
|
270
|
+
readonly slices: import("@motionscript/sdk").Type<PieSlice[], PieSlice[], false>;
|
|
271
|
+
readonly ring: import("@motionscript/sdk").Type<RingConfig, RingConfig, false>;
|
|
272
|
+
readonly label: import("@motionscript/sdk").Type<LabelConfig, LabelConfig, false>;
|
|
273
|
+
readonly centerStyle: import("@motionscript/sdk").Type<CenterConfig, CenterConfig, false>;
|
|
274
|
+
readonly labelMode: import("@motionscript/sdk").Type<PieLabelMode, PieLabelMode, false>;
|
|
275
|
+
readonly labelPlacement: import("@motionscript/sdk").Type<PieLabelPlacement, PieLabelPlacement, false>;
|
|
276
|
+
readonly growth: 1;
|
|
277
|
+
readonly labelReveal: 1;
|
|
278
|
+
readonly pops: import("@motionscript/sdk").Type<number[], number[], false>;
|
|
279
|
+
readonly dimOpacity: number;
|
|
280
|
+
readonly centerLabel: "";
|
|
281
|
+
readonly centerCaption: "";
|
|
282
|
+
readonly centerReveal: 1;
|
|
283
|
+
}>, null>>;
|
|
284
|
+
export type PieRing = NodeOf<typeof PieRing>;
|
|
274
285
|
export {};
|
|
275
286
|
//# sourceMappingURL=pie-ring.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pie-ring.d.ts","sourceRoot":"","sources":["../../src/pie-chart/pie-ring.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"pie-ring.d.ts","sourceRoot":"","sources":["../../src/pie-chart/pie-ring.ts"],"names":[],"mappings":"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"}
|