@motionscript/charts 0.1.1-alpha.1 → 0.1.1-alpha.3
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 +23 -0
- package/README.md +21 -12
- package/dist/bar-chart/bar-chart.d.ts +113 -81
- package/dist/bar-chart/bar-chart.d.ts.map +1 -1
- package/dist/bar-chart/bar-chart.js +9 -5
- package/dist/bar-chart/bar-chart.js.map +1 -1
- package/dist/bar-chart/chart-bars.d.ts +29 -5
- package/dist/bar-chart/chart-bars.d.ts.map +1 -1
- package/dist/bar-chart/chart-bars.js +33 -8
- package/dist/bar-chart/chart-bars.js.map +1 -1
- package/dist/bar-chart/shared.d.ts +10 -4
- package/dist/bar-chart/shared.d.ts.map +1 -1
- package/dist/bar-chart/shared.js +12 -5
- package/dist/bar-chart/shared.js.map +1 -1
- package/dist/browser/chunks/chunk-FJHNBNPQ.js +2 -0
- package/dist/browser/chunks/chunk-FJHNBNPQ.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/kit/cartesian.d.ts +6 -4
- package/dist/kit/cartesian.d.ts.map +1 -1
- package/dist/kit/cartesian.js +5 -3
- package/dist/kit/cartesian.js.map +1 -1
- package/dist/kit/style.d.ts +344 -76
- package/dist/kit/style.d.ts.map +1 -1
- package/dist/kit/style.js +198 -101
- package/dist/kit/style.js.map +1 -1
- package/dist/line-chart/line-chart.d.ts +97 -73
- package/dist/line-chart/line-chart.d.ts.map +1 -1
- package/dist/line-chart/line-chart.js +9 -7
- package/dist/line-chart/line-chart.js.map +1 -1
- package/dist/line-chart/shared.d.ts +2 -1
- package/dist/line-chart/shared.d.ts.map +1 -1
- package/dist/line-chart/shared.js +2 -0
- package/dist/line-chart/shared.js.map +1 -1
- package/dist/pie-chart/pie-chart.d.ts +43 -49
- package/dist/pie-chart/pie-chart.d.ts.map +1 -1
- package/dist/pie-chart/pie-chart.js +2 -1
- package/dist/pie-chart/pie-chart.js.map +1 -1
- package/dist/pie-chart/shared.d.ts +15 -10
- package/dist/pie-chart/shared.d.ts.map +1 -1
- package/dist/pie-chart/shared.js +18 -20
- package/dist/pie-chart/shared.js.map +1 -1
- package/dist/radar-chart/radar-chart.d.ts +37 -49
- package/dist/radar-chart/radar-chart.d.ts.map +1 -1
- package/dist/radar-chart/radar-chart.js +10 -11
- package/dist/radar-chart/radar-chart.js.map +1 -1
- package/dist/radar-chart/radar-grid.d.ts +7 -1
- package/dist/radar-chart/radar-grid.d.ts.map +1 -1
- package/dist/radar-chart/radar-grid.js +17 -15
- package/dist/radar-chart/radar-grid.js.map +1 -1
- package/dist/radar-chart/shared.d.ts +4 -2
- package/dist/radar-chart/shared.d.ts.map +1 -1
- package/dist/radar-chart/shared.js +3 -0
- package/dist/radar-chart/shared.js.map +1 -1
- package/dist/radial-chart/radial-chart.d.ts +37 -49
- package/dist/radial-chart/radial-chart.d.ts.map +1 -1
- package/dist/radial-chart/radial-chart.js +2 -1
- package/dist/radial-chart/radial-chart.js.map +1 -1
- package/dist/radial-chart/shared.d.ts +13 -11
- package/dist/radial-chart/shared.d.ts.map +1 -1
- package/dist/radial-chart/shared.js +12 -16
- package/dist/radial-chart/shared.js.map +1 -1
- package/package.json +4 -4
- package/src/bar-chart/bar-chart.ts +17 -6
- package/src/bar-chart/chart-bars.ts +48 -9
- package/src/bar-chart/shared.ts +23 -5
- package/src/kit/cartesian.ts +10 -7
- package/src/kit/style.ts +216 -118
- package/src/line-chart/line-chart.ts +14 -8
- package/src/line-chart/shared.ts +3 -1
- package/src/pie-chart/pie-chart.ts +3 -1
- package/src/pie-chart/shared.ts +26 -22
- package/src/radar-chart/radar-chart.ts +14 -13
- package/src/radar-chart/radar-grid.ts +18 -13
- package/src/radar-chart/shared.ts +5 -2
- package/src/radial-chart/radial-chart.ts +3 -1
- package/src/radial-chart/shared.ts +26 -18
- package/dist/browser/chunks/chunk-R3Q5EE6E.js +0 -2
- package/dist/browser/chunks/chunk-R3Q5EE6E.js.map +0 -7
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type DataRecord, type NodeOf, type Node2D, type Node2DProps as _Node2DProps, type Fill as _Fill, type FillResolved as _FillResolved, type Stroke as _Stroke, type StrokeResolved as _StrokeResolved } from "@motionscript/sdk";
|
|
1
|
+
import { type DataRecord, type NodeOf, type Node2D, type Node2DProps as _Node2DProps, type TextStyle as _TextStyle, type Fill as _Fill, type FillResolved as _FillResolved, type Stroke as _Stroke, type StrokeResolved as _StrokeResolved } from "@motionscript/sdk";
|
|
2
2
|
import { type ChartSeries } from "../kit/shared.js";
|
|
3
3
|
/** What a radar chart plots, as its entries hold it. */
|
|
4
4
|
export interface RadarValues {
|
|
@@ -33,46 +33,42 @@ export declare const RadarChart: import("@motionscript/sdk").Component<"radarCha
|
|
|
33
33
|
/** The value at the rim; 0 rounds the largest value up. */
|
|
34
34
|
readonly max: 0;
|
|
35
35
|
readonly style: import("@motionscript/sdk").Type<import("@motionscript/sdk").StyleInput<{
|
|
36
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
37
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
38
|
+
} & {
|
|
36
39
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
37
40
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
41
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
38
42
|
} & {
|
|
39
43
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
40
44
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
41
45
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
42
46
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
43
47
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
48
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
44
49
|
} & {
|
|
45
|
-
|
|
46
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
47
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
48
|
-
} & {
|
|
49
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
50
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
51
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
52
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
50
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
53
51
|
} & {
|
|
54
52
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
55
53
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
56
54
|
dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
57
55
|
dotSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
58
56
|
}>, import("@motionscript/sdk").StyleValues<{
|
|
57
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
58
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
59
|
+
} & {
|
|
59
60
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
60
61
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
62
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
61
63
|
} & {
|
|
62
64
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
63
65
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
64
66
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
65
67
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
66
68
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
69
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
67
70
|
} & {
|
|
68
|
-
|
|
69
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
70
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
71
|
-
} & {
|
|
72
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
73
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
74
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
75
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
71
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
76
72
|
} & {
|
|
77
73
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
78
74
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
@@ -100,46 +96,42 @@ export declare const RadarChart: import("@motionscript/sdk").Component<"radarCha
|
|
|
100
96
|
/** The value at the rim; 0 rounds the largest value up. */
|
|
101
97
|
readonly max: 0;
|
|
102
98
|
readonly style: import("@motionscript/sdk").Type<import("@motionscript/sdk").StyleInput<{
|
|
99
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
100
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
101
|
+
} & {
|
|
103
102
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
104
103
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
104
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
105
105
|
} & {
|
|
106
106
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
107
107
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
108
108
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
109
109
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
110
110
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
111
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
111
112
|
} & {
|
|
112
|
-
|
|
113
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
114
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
115
|
-
} & {
|
|
116
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
117
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
118
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
119
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
113
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
120
114
|
} & {
|
|
121
115
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
122
116
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
123
117
|
dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
124
118
|
dotSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
125
119
|
}>, import("@motionscript/sdk").StyleValues<{
|
|
120
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
121
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
122
|
+
} & {
|
|
126
123
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
127
124
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
125
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
128
126
|
} & {
|
|
129
127
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
130
128
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
131
129
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
132
130
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
133
131
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
132
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
134
133
|
} & {
|
|
135
|
-
|
|
136
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
137
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
138
|
-
} & {
|
|
139
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
140
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
141
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
142
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
134
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
143
135
|
} & {
|
|
144
136
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
145
137
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
@@ -156,46 +148,42 @@ export declare const RadarChart: import("@motionscript/sdk").Component<"radarCha
|
|
|
156
148
|
/** The value at the rim; 0 rounds the largest value up. */
|
|
157
149
|
readonly max: 0;
|
|
158
150
|
readonly style: import("@motionscript/sdk").Type<import("@motionscript/sdk").StyleInput<{
|
|
151
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
152
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
153
|
+
} & {
|
|
159
154
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
160
155
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
156
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
161
157
|
} & {
|
|
162
158
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
163
159
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
164
160
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
165
161
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
166
162
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
163
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
167
164
|
} & {
|
|
168
|
-
|
|
169
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
170
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
171
|
-
} & {
|
|
172
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
173
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
174
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
175
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
165
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
176
166
|
} & {
|
|
177
167
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
178
168
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
179
169
|
dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
180
170
|
dotSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
181
171
|
}>, import("@motionscript/sdk").StyleValues<{
|
|
172
|
+
gridBackground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
173
|
+
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
174
|
+
} & {
|
|
182
175
|
legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
|
|
183
176
|
swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
|
|
177
|
+
legendText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
184
178
|
} & {
|
|
185
179
|
gridShape: import("@motionscript/sdk").Type<"circle" | "polygon", "circle" | "polygon", false>;
|
|
186
180
|
gridLevels: import("@motionscript/sdk").Type<number, number, false>;
|
|
187
181
|
gridStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
188
182
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
|
|
189
183
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
184
|
+
spokeText: import("@motionscript/sdk").Type<_TextStyle, _TextStyle, false>;
|
|
190
185
|
} & {
|
|
191
|
-
|
|
192
|
-
fontSize: import("@motionscript/sdk").Type<number, number, false>;
|
|
193
|
-
fontWeight: import("@motionscript/sdk").Type<number, number, false>;
|
|
194
|
-
} & {
|
|
195
|
-
palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
196
|
-
foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
197
|
-
muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
198
|
-
background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
|
|
186
|
+
seriesFills: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
|
|
199
187
|
} & {
|
|
200
188
|
strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
|
|
201
189
|
areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radar-chart.d.ts","sourceRoot":"","sources":["../../src/radar-chart/radar-chart.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"radar-chart.d.ts","sourceRoot":"","sources":["../../src/radar-chart/radar-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,UAAU,EACf,KAAK,MAAM,EAEX,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,SAAS,IAAI,UAAU,EAC5B,KAAK,IAAI,IAAI,KAAK,EAClB,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,cAAc,IAAI,eAAe,EAGvC,MAAM,mBAAmB,CAAA;AAM1B,OAAO,EAAiB,KAAK,WAAW,EAAE,MAAM,eAAe,CAAA;AA2B/D,wDAAwD;AACxD,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,CAAA;IAC3B,QAAQ,CAAC,aAAa,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,MAAM,EAAE,WAAW,EAAE,CAAA;IAC9B,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAA;CACrB;AAED,kFAAkF;AAClF,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAE3E;AAED,uEAAuE;AACvE,wBAAgB,cAAc,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAQ1E;AAgCD;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU;;IAInB,wCAAwC;;;IAGxC,0CAA0C;;IAE1C,2DAA2D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAL3D,wCAAwC;;;IAGxC,0CAA0C;;IAE1C,2DAA2D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAL3D,wCAAwC;;;IAGxC,0CAA0C;;IAE1C,2DAA2D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAiK7D,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,UAAU,CAAC,CAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { Rect, Text, Types, component2d, easeOut,
|
|
2
|
-
import { laidOutSize } from "../kit/cartesian.js";
|
|
1
|
+
import { Rect, Text, Types, component2d, easeOut, } from "@motionscript/sdk";
|
|
2
|
+
import { boundText, laidOutSize } from "../kit/cartesian.js";
|
|
3
3
|
import { ChartLegend } from "../kit/chart-legend.js";
|
|
4
4
|
import { SERIES_ARG, asParts, fresh } from "../kit/entries.js";
|
|
5
5
|
import { ENTER_SHARE, LEGEND_SLIDE, beats } from "../kit/motion.js";
|
|
6
6
|
import { SPOTLIGHT_DIM } from "../kit/shared.js";
|
|
7
|
-
import {
|
|
7
|
+
import { CHART_LEGEND, CHART_SERIES, CHART_STYLE_FAMILY, CHART_STYLE_PRESETS, GRID_BACKGROUND, legendConfigOf, migrateChartStyle, placedText, seriesFill, sizeOf, } from "../kit/style.js";
|
|
8
8
|
import { RadarGrid } from "./radar-grid.js";
|
|
9
9
|
import { RadarSeries } from "./radar-series.js";
|
|
10
10
|
import { RADAR_GRID, RADAR_MARKS, categoriesOf, fitRadius, fractionOf, labelAnchor, labelPoint, scaleOf, valuesOf, } from "./shared.js";
|
|
@@ -73,8 +73,8 @@ export const RadarChart = component2d({
|
|
|
73
73
|
/** The value at the rim; 0 rounds the largest value up. */
|
|
74
74
|
max: 0,
|
|
75
75
|
style: Types.style(CHART_STYLE_FAMILY, {
|
|
76
|
-
|
|
77
|
-
|
|
76
|
+
series: CHART_SERIES,
|
|
77
|
+
background: GRID_BACKGROUND,
|
|
78
78
|
grid: RADAR_GRID,
|
|
79
79
|
marks: RADAR_MARKS,
|
|
80
80
|
legend: CHART_LEGEND,
|
|
@@ -82,18 +82,20 @@ export const RadarChart = component2d({
|
|
|
82
82
|
},
|
|
83
83
|
// A node made of parts that fill would otherwise hug them.
|
|
84
84
|
defaults: { width: "fill", height: "fill" },
|
|
85
|
+
migrate: { style: migrateChartStyle("radar") },
|
|
85
86
|
allowedChildren: [],
|
|
86
87
|
children: (state) => {
|
|
87
88
|
const style = () => state.style;
|
|
88
89
|
let plot;
|
|
89
90
|
const plotSize = () => laidOutSize(plot);
|
|
90
|
-
const radius = () => fitRadius(plotSize(), categoriesOf(state.data, state.categoryField), style().
|
|
91
|
+
const radius = () => fitRadius(plotSize(), categoriesOf(state.data, state.categoryField), sizeOf(style().spokeText), style().spokeLabels);
|
|
91
92
|
const count = state.data.length;
|
|
92
93
|
const enabled = state.series.map((s) => s.enabled ?? true);
|
|
93
94
|
const grid = new RadarGrid({
|
|
94
95
|
count: () => state.data.length,
|
|
95
96
|
radius,
|
|
96
97
|
levels: () => style().gridLevels,
|
|
98
|
+
fill: () => style().gridBackground,
|
|
97
99
|
shape: () => style().gridShape,
|
|
98
100
|
stroke: () => style().gridStroke,
|
|
99
101
|
spokeStroke: () => style().spokeStroke,
|
|
@@ -117,13 +119,10 @@ export const RadarChart = component2d({
|
|
|
117
119
|
for (let i = 0; i < count; i++) {
|
|
118
120
|
const anchor = labelAnchor(i, count);
|
|
119
121
|
const align = anchor === "centerLeft" ? "left" : anchor === "centerRight" ? "right" : "center";
|
|
120
|
-
const at = () => labelPoint(i, count, radius(), style().
|
|
122
|
+
const at = () => labelPoint(i, count, radius(), sizeOf(style().spokeText));
|
|
121
123
|
labels.push(new Text({
|
|
122
|
-
...
|
|
124
|
+
...boundText(() => placedText(style().spokeText, align)),
|
|
123
125
|
text: () => categoriesOf(state.data, state.categoryField)[i] ?? "",
|
|
124
|
-
fontSize: () => style().fontSize,
|
|
125
|
-
fontWeight: () => style().fontWeight,
|
|
126
|
-
fill: () => style().muted,
|
|
127
126
|
[anchor]: at,
|
|
128
127
|
}));
|
|
129
128
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radar-chart.js","sourceRoot":"","sources":["../../src/radar-chart/radar-chart.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Rect,\n Text,\n Types,\n component2d,\n easeOut,\n textOps,\n type ChildView,\n type DataRecord,\n type NodeOf,\n // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n type Node2D,\n type Node2DProps as _Node2DProps,\n type Fill as _Fill,\n type FillResolved as _FillResolved,\n type Stroke as _Stroke,\n type StrokeResolved as _StrokeResolved,\n type Size2D,\n type Vector2,\n} from \"@motionscript/sdk\"\n\nimport { laidOutSize } from \"../kit/cartesian\"\nimport { ChartLegend } from \"../kit/chart-legend\"\nimport { SERIES_ARG, asParts, fresh } from \"../kit/entries\"\nimport { ENTER_SHARE, LEGEND_SLIDE, beats, type AnyTimeline, type Beat } from \"../kit/motion\"\nimport { SPOTLIGHT_DIM, type ChartSeries } from \"../kit/shared\"\nimport {\n CHART_COLORS,\n CHART_LEGEND,\n CHART_STYLE_FAMILY,\n CHART_STYLE_PRESETS,\n CHART_TEXT,\n legendConfigOf,\n markerText,\n seriesFill,\n} from \"../kit/style\"\nimport { RadarGrid } from \"./radar-grid\"\nimport { RadarSeries } from \"./radar-series\"\nimport {\n RADAR_GRID,\n RADAR_MARKS,\n categoriesOf,\n fitRadius,\n fractionOf,\n labelAnchor,\n labelPoint,\n scaleOf,\n valuesOf,\n} from \"./shared\"\n\n/** What a radar chart plots, as its entries hold it. */\nexport interface RadarValues {\n readonly data: DataRecord[]\n readonly categoryField: string\n readonly series: ChartSeries[]\n readonly min: number\n readonly max: number\n}\n\n/** The scale the web is drawn to, whether `max` was given or left to the data. */\nexport function radarScale(state: RadarValues): { min: number; max: number } {\n return scaleOf(valuesOf(state.data, state.series), state.min, state.max)\n}\n\n/** Series `index`'s values as fractions of the rim, in spoke order. */\nexport function radarFractions(state: RadarValues, index: number): number[] {\n const series = state.series[index]\n if (!series) return []\n const scale = radarScale(state)\n return state.data.map((row) => {\n const v = row[series.field]\n return fractionOf(typeof v === \"number\" && Number.isFinite(v) ? v : 0, scale)\n })\n}\n\n/** The grid, series, label layer and legend among the children; the last row holding a grid is the one the chart built. */\nfunction partsOf(children: readonly ChildView[]) {\n for (let i = children.length - 1; i >= 0; i--) {\n const row = children[i]\n if (!Rect.is(row)) continue\n const plot = row.children.find((part) => Rect.is(part) && part.children.some(RadarGrid.is))\n if (!plot) continue\n return {\n grid: plot.children.find(RadarGrid.is)!,\n series: plot.children.filter(RadarSeries.is),\n labels: plot.children.find(Rect.is) ?? null,\n legend: row.children.find(ChartLegend.is) ?? null,\n }\n }\n return null\n}\n\nfunction toggling(timeline: AnyTimeline, children: readonly ChildView[], index: number, show: boolean) {\n const parts = partsOf(children)\n const series = parts?.series[index]\n if (!parts || !series) return timeline.wait(timeline.duration)\n return timeline.together([\n series.run(\"enter\", show ? { from: 0, to: 1 } : { from: 1, to: 0 }),\n ...(parts.legend ? [parts.legend.run(show ? \"showSeries\" : \"hideSeries\", { index })] : []),\n ])\n}\n\n/** The share of one series' growth that passes before the next starts. */\nconst STAGGER = 0.3\n\n/**\n * A radar (spider) chart: one spoke per data row, one closed polygon per\n * series, over a web of rings. Composed of a {@link RadarGrid}, a\n * {@link RadarSeries} per series, the category labels and a {@link ChartLegend}.\n *\n * Resting state is the finished chart; `enter` arms every part on its first\n * frame. `max` of 0 (or one not above `min`) is the largest value rounded up.\n */\nexport const RadarChart = component2d({\n key: \"radarChart\",\n state: {\n data: fresh<DataRecord[]>(() => [], { kind: \"dataset\" }),\n /** The column that names each spoke. */\n categoryField: \"\",\n series: fresh<ChartSeries[]>(() => [], { kind: \"series\" }),\n /** The value at the centre of the web. */\n min: 0,\n /** The value at the rim; 0 rounds the largest value up. */\n max: 0,\n style: Types.style(\n CHART_STYLE_FAMILY,\n {\n colors: CHART_COLORS,\n text: CHART_TEXT,\n grid: RADAR_GRID,\n marks: RADAR_MARKS,\n legend: CHART_LEGEND,\n },\n { presets: CHART_STYLE_PRESETS }\n ),\n },\n // A node made of parts that fill would otherwise hug them.\n defaults: { width: \"fill\", height: \"fill\" },\n allowedChildren: [],\n children: (state) => {\n const style = () => state.style\n let plot: Node2D | undefined\n const plotSize = (): Size2D => laidOutSize(plot)\n const radius = () => fitRadius(plotSize(), categoriesOf(state.data, state.categoryField), style().fontSize, style().spokeLabels)\n const count = state.data.length\n const enabled = state.series.map((s) => s.enabled ?? true)\n\n const grid = new RadarGrid({\n count: () => state.data.length,\n radius,\n levels: () => style().gridLevels,\n shape: () => style().gridShape,\n stroke: () => style().gridStroke,\n spokeStroke: () => style().spokeStroke,\n }) as unknown as Node2D\n\n const series = state.series.map(\n (s, i) =>\n new RadarSeries({\n fractions: () => radarFractions(state, i),\n radius,\n fill: () => seriesFill(style(), s, i),\n stroke: () => {\n const weight = style().strokeWidth\n return weight > 0 ? { weight, fill: seriesFill(style(), s, i), align: \"center\", join: \"round\" } : []\n },\n areaOpacity: () => style().areaOpacity,\n dots: () => style().dots,\n dotSize: () => style().dotSize,\n enabled: enabled[i],\n }) as unknown as Node2D\n )\n\n const parts: Node2D[] = [grid, ...series]\n\n if (state.style.spokeLabels) {\n const labels: Node2D[] = []\n for (let i = 0; i < count; i++) {\n const anchor = labelAnchor(i, count)\n const align = anchor === \"centerLeft\" ? \"left\" : anchor === \"centerRight\" ? \"right\" : \"center\"\n const at = (): Vector2 => labelPoint(i, count, radius(), style().fontSize)\n labels.push(\n new Text({\n ...textOps.styleProps(markerText(state.style, align)),\n text: () => categoriesOf(state.data, state.categoryField)[i] ?? \"\",\n fontSize: () => style().fontSize,\n fontWeight: () => style().fontWeight,\n fill: () => style().muted,\n [anchor]: at,\n }) as unknown as Node2D\n )\n }\n parts.push(new Rect({ width: \"fill\", height: \"fill\", children: labels }) as unknown as Node2D)\n }\n\n plot = new Rect({ width: \"fill\", height: \"fill\", children: parts }) as unknown as Node2D\n\n const row: Node2D[] = [plot]\n const position = state.style.legend\n if (position !== \"none\") {\n const side = position === \"right\"\n const config = legendConfigOf(state.style)\n const legend = new ChartLegend({\n series: state.series,\n swatches: () => state.series.map((s, i) => seriesFill(style(), s, i)),\n legend: () => legendConfigOf(style()),\n flow: side ? \"vertical\" : \"horizontal\",\n // Spacing is fixed as built; a style tween re-paints the swatches and captions only.\n gap: side ? Math.round(config.itemGap / 2) : config.itemGap,\n padding: config.padding,\n }) as unknown as Node2D\n if (position === \"top\") row.unshift(legend)\n else row.push(legend)\n }\n\n const frame = new Rect({\n flow: position === \"right\" ? \"horizontal\" : \"vertical\",\n width: \"fill\",\n height: \"fill\",\n gap: 24,\n align: \"center\",\n fill: () => style().background,\n children: row,\n })\n return asParts([frame as unknown as Node2D])\n },\n commands: {\n /** The web grows out, the polygons grow from the centre one series after another, then the labels and legend come up. */\n enter: {\n args: {},\n // Held from arrival, so it never shows finished ahead of its draw.\n entrance: true,\n easing: easeOut(),\n run: (timeline, _state, children) => {\n const parts = partsOf(children)\n if (!parts) return timeline.wait(timeline.duration)\n const duration = timeline.duration\n const web = duration * ENTER_SHARE.axes\n const marks = duration * ENTER_SHARE.marks\n const last = duration * ENTER_SHARE.legend\n const n = Math.max(1, parts.series.length)\n const each = marks / (1 + STAGGER * (n - 1))\n const { legend, labels } = parts\n const at0 = (piece: Beat[\"piece\"]): Beat => ({ at: 0, duration: 0, piece })\n // The first frame arms what every later beat moves: a beat ahead of the playhead writes nothing.\n return beats(timeline, [\n at0(parts.grid.to({ reveal: 0 })),\n ...parts.series.map((s) => at0(s.to({ progress: 0 }))),\n ...(labels ? [at0(labels.to({ opacity: 0 }))] : []),\n ...(legend ? [at0(legend.to({ opacity: 0, y: -LEGEND_SLIDE }))] : []),\n { at: 0, duration: web, piece: parts.grid.to({ reveal: 1 }) },\n ...parts.series.map((s, i) => ({ at: web + i * each * STAGGER, duration: each, piece: s.to({ progress: 1 }) })),\n ...(labels ? [{ at: web + marks * 0.6, duration: last + marks * 0.4, piece: labels.to({ opacity: 1 }) }] : []),\n ...(legend ? [{ at: web + marks, duration: last, piece: legend.to({ opacity: 1, y: 0 }) }] : []),\n ])\n },\n },\n /** Grow series `index`'s polygon back out of the centre, with its legend entry growing in. */\n showSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => toggling(timeline, children, timeline.args.seriesIndex, true),\n },\n /** Shrink series `index`'s polygon into the centre as its legend entry shrinks away. */\n hideSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => toggling(timeline, children, timeline.args.seriesIndex, false),\n },\n /** Fade every other series, polygon and legend entry, to focus on `index`. The legend dims in place, so the row does not reflow. */\n spotlightSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => {\n const parts = partsOf(children)\n if (!parts) return timeline.wait(timeline.duration)\n const index = timeline.args.seriesIndex\n return timeline.together([\n ...parts.series.map((s, i) => s.to({ opacity: i === index ? 1 : SPOTLIGHT_DIM })),\n ...(parts.legend ? [parts.legend.run(\"spotlightSeries\", { index })] : []),\n ])\n },\n },\n },\n})\n\nexport type RadarChart = NodeOf<typeof RadarChart>\n"]}
|
|
1
|
+
{"version":3,"file":"radar-chart.js","sourceRoot":"","sources":["../../src/radar-chart/radar-chart.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Rect,\n Text,\n Types,\n component2d,\n easeOut,\n type ChildView,\n type DataRecord,\n type NodeOf,\n // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n type Node2D,\n type Node2DProps as _Node2DProps,\n type TextStyle as _TextStyle,\n type Fill as _Fill,\n type FillResolved as _FillResolved,\n type Stroke as _Stroke,\n type StrokeResolved as _StrokeResolved,\n type Size2D,\n type Vector2,\n} from \"@motionscript/sdk\"\n\nimport { boundText, laidOutSize } from \"../kit/cartesian\"\nimport { ChartLegend } from \"../kit/chart-legend\"\nimport { SERIES_ARG, asParts, fresh } from \"../kit/entries\"\nimport { ENTER_SHARE, LEGEND_SLIDE, beats, type AnyTimeline, type Beat } from \"../kit/motion\"\nimport { SPOTLIGHT_DIM, type ChartSeries } from \"../kit/shared\"\nimport {\n CHART_LEGEND,\n CHART_SERIES,\n CHART_STYLE_FAMILY,\n CHART_STYLE_PRESETS,\n GRID_BACKGROUND,\n legendConfigOf,\n migrateChartStyle,\n placedText,\n seriesFill,\n sizeOf,\n} from \"../kit/style\"\nimport { RadarGrid } from \"./radar-grid\"\nimport { RadarSeries } from \"./radar-series\"\nimport {\n RADAR_GRID,\n RADAR_MARKS,\n categoriesOf,\n fitRadius,\n fractionOf,\n labelAnchor,\n labelPoint,\n scaleOf,\n valuesOf,\n} from \"./shared\"\n\n/** What a radar chart plots, as its entries hold it. */\nexport interface RadarValues {\n readonly data: DataRecord[]\n readonly categoryField: string\n readonly series: ChartSeries[]\n readonly min: number\n readonly max: number\n}\n\n/** The scale the web is drawn to, whether `max` was given or left to the data. */\nexport function radarScale(state: RadarValues): { min: number; max: number } {\n return scaleOf(valuesOf(state.data, state.series), state.min, state.max)\n}\n\n/** Series `index`'s values as fractions of the rim, in spoke order. */\nexport function radarFractions(state: RadarValues, index: number): number[] {\n const series = state.series[index]\n if (!series) return []\n const scale = radarScale(state)\n return state.data.map((row) => {\n const v = row[series.field]\n return fractionOf(typeof v === \"number\" && Number.isFinite(v) ? v : 0, scale)\n })\n}\n\n/** The grid, series, label layer and legend among the children; the last row holding a grid is the one the chart built. */\nfunction partsOf(children: readonly ChildView[]) {\n for (let i = children.length - 1; i >= 0; i--) {\n const row = children[i]\n if (!Rect.is(row)) continue\n const plot = row.children.find((part) => Rect.is(part) && part.children.some(RadarGrid.is))\n if (!plot) continue\n return {\n grid: plot.children.find(RadarGrid.is)!,\n series: plot.children.filter(RadarSeries.is),\n labels: plot.children.find(Rect.is) ?? null,\n legend: row.children.find(ChartLegend.is) ?? null,\n }\n }\n return null\n}\n\nfunction toggling(timeline: AnyTimeline, children: readonly ChildView[], index: number, show: boolean) {\n const parts = partsOf(children)\n const series = parts?.series[index]\n if (!parts || !series) return timeline.wait(timeline.duration)\n return timeline.together([\n series.run(\"enter\", show ? { from: 0, to: 1 } : { from: 1, to: 0 }),\n ...(parts.legend ? [parts.legend.run(show ? \"showSeries\" : \"hideSeries\", { index })] : []),\n ])\n}\n\n/** The share of one series' growth that passes before the next starts. */\nconst STAGGER = 0.3\n\n/**\n * A radar (spider) chart: one spoke per data row, one closed polygon per\n * series, over a web of rings. Composed of a {@link RadarGrid}, a\n * {@link RadarSeries} per series, the category labels and a {@link ChartLegend}.\n *\n * Resting state is the finished chart; `enter` arms every part on its first\n * frame. `max` of 0 (or one not above `min`) is the largest value rounded up.\n */\nexport const RadarChart = component2d({\n key: \"radarChart\",\n state: {\n data: fresh<DataRecord[]>(() => [], { kind: \"dataset\" }),\n /** The column that names each spoke. */\n categoryField: \"\",\n series: fresh<ChartSeries[]>(() => [], { kind: \"series\" }),\n /** The value at the centre of the web. */\n min: 0,\n /** The value at the rim; 0 rounds the largest value up. */\n max: 0,\n style: Types.style(\n CHART_STYLE_FAMILY,\n {\n series: CHART_SERIES,\n background: GRID_BACKGROUND,\n grid: RADAR_GRID,\n marks: RADAR_MARKS,\n legend: CHART_LEGEND,\n },\n { presets: CHART_STYLE_PRESETS }\n ),\n },\n // A node made of parts that fill would otherwise hug them.\n defaults: { width: \"fill\", height: \"fill\" },\n migrate: { style: migrateChartStyle(\"radar\") },\n allowedChildren: [],\n children: (state) => {\n const style = () => state.style\n let plot: Node2D | undefined\n const plotSize = (): Size2D => laidOutSize(plot)\n const radius = () => fitRadius(plotSize(), categoriesOf(state.data, state.categoryField), sizeOf(style().spokeText), style().spokeLabels)\n const count = state.data.length\n const enabled = state.series.map((s) => s.enabled ?? true)\n\n const grid = new RadarGrid({\n count: () => state.data.length,\n radius,\n levels: () => style().gridLevels,\n fill: () => style().gridBackground,\n shape: () => style().gridShape,\n stroke: () => style().gridStroke,\n spokeStroke: () => style().spokeStroke,\n }) as unknown as Node2D\n\n const series = state.series.map(\n (s, i) =>\n new RadarSeries({\n fractions: () => radarFractions(state, i),\n radius,\n fill: () => seriesFill(style(), s, i),\n stroke: () => {\n const weight = style().strokeWidth\n return weight > 0 ? { weight, fill: seriesFill(style(), s, i), align: \"center\", join: \"round\" } : []\n },\n areaOpacity: () => style().areaOpacity,\n dots: () => style().dots,\n dotSize: () => style().dotSize,\n enabled: enabled[i],\n }) as unknown as Node2D\n )\n\n const parts: Node2D[] = [grid, ...series]\n\n if (state.style.spokeLabels) {\n const labels: Node2D[] = []\n for (let i = 0; i < count; i++) {\n const anchor = labelAnchor(i, count)\n const align = anchor === \"centerLeft\" ? \"left\" : anchor === \"centerRight\" ? \"right\" : \"center\"\n const at = (): Vector2 => labelPoint(i, count, radius(), sizeOf(style().spokeText))\n labels.push(\n new Text({\n ...boundText(() => placedText(style().spokeText, align)),\n text: () => categoriesOf(state.data, state.categoryField)[i] ?? \"\",\n [anchor]: at,\n }) as unknown as Node2D\n )\n }\n parts.push(new Rect({ width: \"fill\", height: \"fill\", children: labels }) as unknown as Node2D)\n }\n\n plot = new Rect({ width: \"fill\", height: \"fill\", children: parts }) as unknown as Node2D\n\n const row: Node2D[] = [plot]\n const position = state.style.legend\n if (position !== \"none\") {\n const side = position === \"right\"\n const config = legendConfigOf(state.style)\n const legend = new ChartLegend({\n series: state.series,\n swatches: () => state.series.map((s, i) => seriesFill(style(), s, i)),\n legend: () => legendConfigOf(style()),\n flow: side ? \"vertical\" : \"horizontal\",\n // Spacing is fixed as built; a style tween re-paints the swatches and captions only.\n gap: side ? Math.round(config.itemGap / 2) : config.itemGap,\n padding: config.padding,\n }) as unknown as Node2D\n if (position === \"top\") row.unshift(legend)\n else row.push(legend)\n }\n\n const frame = new Rect({\n flow: position === \"right\" ? \"horizontal\" : \"vertical\",\n width: \"fill\",\n height: \"fill\",\n gap: 24,\n align: \"center\",\n fill: () => style().background,\n children: row,\n })\n return asParts([frame as unknown as Node2D])\n },\n commands: {\n /** The web grows out, the polygons grow from the centre one series after another, then the labels and legend come up. */\n enter: {\n args: {},\n // Held from arrival, so it never shows finished ahead of its draw.\n entrance: true,\n easing: easeOut(),\n run: (timeline, _state, children) => {\n const parts = partsOf(children)\n if (!parts) return timeline.wait(timeline.duration)\n const duration = timeline.duration\n const web = duration * ENTER_SHARE.axes\n const marks = duration * ENTER_SHARE.marks\n const last = duration * ENTER_SHARE.legend\n const n = Math.max(1, parts.series.length)\n const each = marks / (1 + STAGGER * (n - 1))\n const { legend, labels } = parts\n const at0 = (piece: Beat[\"piece\"]): Beat => ({ at: 0, duration: 0, piece })\n // The first frame arms what every later beat moves: a beat ahead of the playhead writes nothing.\n return beats(timeline, [\n at0(parts.grid.to({ reveal: 0 })),\n ...parts.series.map((s) => at0(s.to({ progress: 0 }))),\n ...(labels ? [at0(labels.to({ opacity: 0 }))] : []),\n ...(legend ? [at0(legend.to({ opacity: 0, y: -LEGEND_SLIDE }))] : []),\n { at: 0, duration: web, piece: parts.grid.to({ reveal: 1 }) },\n ...parts.series.map((s, i) => ({ at: web + i * each * STAGGER, duration: each, piece: s.to({ progress: 1 }) })),\n ...(labels ? [{ at: web + marks * 0.6, duration: last + marks * 0.4, piece: labels.to({ opacity: 1 }) }] : []),\n ...(legend ? [{ at: web + marks, duration: last, piece: legend.to({ opacity: 1, y: 0 }) }] : []),\n ])\n },\n },\n /** Grow series `index`'s polygon back out of the centre, with its legend entry growing in. */\n showSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => toggling(timeline, children, timeline.args.seriesIndex, true),\n },\n /** Shrink series `index`'s polygon into the centre as its legend entry shrinks away. */\n hideSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => toggling(timeline, children, timeline.args.seriesIndex, false),\n },\n /** Fade every other series, polygon and legend entry, to focus on `index`. The legend dims in place, so the row does not reflow. */\n spotlightSeries: {\n args: { seriesIndex: SERIES_ARG },\n easing: easeOut(),\n run: (timeline, _state, children) => {\n const parts = partsOf(children)\n if (!parts) return timeline.wait(timeline.duration)\n const index = timeline.args.seriesIndex\n return timeline.together([\n ...parts.series.map((s, i) => s.to({ opacity: i === index ? 1 : SPOTLIGHT_DIM })),\n ...(parts.legend ? [parts.legend.run(\"spotlightSeries\", { index })] : []),\n ])\n },\n },\n },\n})\n\nexport type RadarChart = NodeOf<typeof RadarChart>\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type NodeOf, type Node2D as _Node2D, type Node2DProps as _Node2DProps, type Stroke, type StrokeResolved } from "@motionscript/sdk";
|
|
1
|
+
import { type Fill, type FillResolved, type NodeOf, type Node2D as _Node2D, type Node2DProps as _Node2DProps, type Stroke, type StrokeResolved } from "@motionscript/sdk";
|
|
2
2
|
import { type GridShape } from "./shared.js";
|
|
3
3
|
/**
|
|
4
4
|
* The web of a {@link RadarChart}: `levels` rings and, if asked, a spoke to each
|
|
@@ -10,6 +10,8 @@ export declare const RadarGrid: import("@motionscript/sdk").Component<"radarGrid
|
|
|
10
10
|
/** The rim, in px. */
|
|
11
11
|
readonly radius: 0;
|
|
12
12
|
readonly levels: 4;
|
|
13
|
+
/** Inside the outer ring, under the rings and spokes; empty paints nothing. */
|
|
14
|
+
readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
|
|
13
15
|
readonly shape: import("@motionscript/sdk").Type<GridShape, GridShape, false>;
|
|
14
16
|
readonly stroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
|
|
15
17
|
/** The line out to each category; empty draws none. */
|
|
@@ -21,6 +23,8 @@ export declare const RadarGrid: import("@motionscript/sdk").Component<"radarGrid
|
|
|
21
23
|
/** The rim, in px. */
|
|
22
24
|
readonly radius: 0;
|
|
23
25
|
readonly levels: 4;
|
|
26
|
+
/** Inside the outer ring, under the rings and spokes; empty paints nothing. */
|
|
27
|
+
readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
|
|
24
28
|
readonly shape: import("@motionscript/sdk").Type<GridShape, GridShape, false>;
|
|
25
29
|
readonly stroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
|
|
26
30
|
/** The line out to each category; empty draws none. */
|
|
@@ -32,6 +36,8 @@ export declare const RadarGrid: import("@motionscript/sdk").Component<"radarGrid
|
|
|
32
36
|
/** The rim, in px. */
|
|
33
37
|
readonly radius: 0;
|
|
34
38
|
readonly levels: 4;
|
|
39
|
+
/** Inside the outer ring, under the rings and spokes; empty paints nothing. */
|
|
40
|
+
readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
|
|
35
41
|
readonly shape: import("@motionscript/sdk").Type<GridShape, GridShape, false>;
|
|
36
42
|
readonly stroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
|
|
37
43
|
/** The line out to each category; empty draws none. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radar-grid.d.ts","sourceRoot":"","sources":["../../src/radar-chart/radar-grid.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"radar-grid.d.ts","sourceRoot":"","sources":["../../src/radar-chart/radar-grid.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAEX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,MAAM,EACX,KAAK,cAAc,EAEpB,MAAM,mBAAmB,CAAA;AAG1B,OAAO,EAAkB,KAAK,SAAS,EAAE,MAAM,UAAU,CAAA;AAEzD;;;;GAIG;AACH,eAAO,MAAM,SAAS;;IAIlB,sBAAsB;;;IAGtB,+EAA+E;;;;IAI/E,uDAAuD;;IAEvD,uFAAuF;;;;IATvF,sBAAsB;;;IAGtB,+EAA+E;;;;IAI/E,uDAAuD;;IAEvD,uFAAuF;;;;IATvF,sBAAsB;;;IAGtB,+EAA+E;;;;IAI/E,uDAAuD;;IAEvD,uFAAuF;;gCAyCzF,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Graphics2D, Types, clamp, component2d, strokeOps, } from "@motionscript/sdk";
|
|
1
|
+
import { Graphics2D, Types, clamp, component2d, fillOps, strokeOps, } from "@motionscript/sdk";
|
|
2
2
|
import { loadPaints } from "../kit/paints.js";
|
|
3
3
|
import { spokeDirection } from "./shared.js";
|
|
4
4
|
/**
|
|
@@ -13,6 +13,8 @@ export const RadarGrid = component2d({
|
|
|
13
13
|
/** The rim, in px. */
|
|
14
14
|
radius: 0,
|
|
15
15
|
levels: 4,
|
|
16
|
+
/** Inside the outer ring, under the rings and spokes; empty paints nothing. */
|
|
17
|
+
fill: Types.custom([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),
|
|
16
18
|
shape: Types.custom("polygon"),
|
|
17
19
|
stroke: Types.custom([], { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),
|
|
18
20
|
/** The line out to each category; empty draws none. */
|
|
@@ -21,7 +23,7 @@ export const RadarGrid = component2d({
|
|
|
21
23
|
reveal: 1,
|
|
22
24
|
},
|
|
23
25
|
defaults: { width: "fill", height: "fill" },
|
|
24
|
-
load: (loader, state) => loadPaints(loader, { strokes: [state.stroke, state.spokeStroke] }),
|
|
26
|
+
load: (loader, state) => loadPaints(loader, { fills: [state.fill], strokes: [state.stroke, state.spokeStroke] }),
|
|
25
27
|
render: (ctx, state) => {
|
|
26
28
|
const grow = clamp(state.reveal, 0, 1);
|
|
27
29
|
const rim = state.radius * grow;
|
|
@@ -30,22 +32,22 @@ export const RadarGrid = component2d({
|
|
|
30
32
|
const count = Math.max(0, Math.round(state.count));
|
|
31
33
|
const levels = Math.max(1, Math.round(state.levels));
|
|
32
34
|
const round = state.shape === "circle" || count < 3;
|
|
35
|
+
const outline = (g, r) => {
|
|
36
|
+
if (round)
|
|
37
|
+
return g.ellipse({ width: r * 2, height: r * 2 });
|
|
38
|
+
const points = [];
|
|
39
|
+
for (let i = 0; i < count; i++) {
|
|
40
|
+
const d = spokeDirection(i, count);
|
|
41
|
+
points.push({ x: d.x * r, y: d.y * r });
|
|
42
|
+
}
|
|
43
|
+
return g.line({ points, closed: true });
|
|
44
|
+
};
|
|
45
|
+
if (state.fill.length > 0)
|
|
46
|
+
ctx.draw(outline(new Graphics2D(), rim).fill(state.fill).opacity(grow));
|
|
33
47
|
// One draw per ring: rings chained into one surface would stroke only their union's outline.
|
|
34
48
|
for (let level = 1; state.stroke.length > 0 && level <= levels; level++) {
|
|
35
49
|
const r = (rim * level) / levels;
|
|
36
|
-
|
|
37
|
-
if (round) {
|
|
38
|
-
ring.ellipse({ width: r * 2, height: r * 2 });
|
|
39
|
-
}
|
|
40
|
-
else {
|
|
41
|
-
const points = [];
|
|
42
|
-
for (let i = 0; i < count; i++) {
|
|
43
|
-
const d = spokeDirection(i, count);
|
|
44
|
-
points.push({ x: d.x * r, y: d.y * r });
|
|
45
|
-
}
|
|
46
|
-
ring.line({ points, closed: true });
|
|
47
|
-
}
|
|
48
|
-
ctx.draw(ring.stroke(state.stroke).opacity(grow));
|
|
50
|
+
ctx.draw(outline(new Graphics2D(), r).stroke(state.stroke).opacity(grow));
|
|
49
51
|
}
|
|
50
52
|
if (state.spokeStroke.length === 0)
|
|
51
53
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radar-grid.js","sourceRoot":"","sources":["../../src/radar-chart/radar-grid.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACV,KAAK,EACL,KAAK,EACL,WAAW,EACX,SAAS,
|
|
1
|
+
{"version":3,"file":"radar-grid.js","sourceRoot":"","sources":["../../src/radar-chart/radar-grid.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Graphics2D,\n Types,\n clamp,\n component2d,\n fillOps,\n strokeOps,\n type Fill,\n type FillResolved,\n type NodeOf,\n // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n type Node2D as _Node2D,\n type Node2DProps as _Node2DProps,\n type Stroke,\n type StrokeResolved,\n type Vector2,\n} from \"@motionscript/sdk\"\n\nimport { loadPaints } from \"../kit/paints\"\nimport { spokeDirection, type GridShape } from \"./shared\"\n\n/**\n * The web of a {@link RadarChart}: `levels` rings and, if asked, a spoke to each\n * of `count` categories, drawn from the node's centre out to `radius`. `reveal`\n * grows the web from nothing.\n */\nexport const RadarGrid = component2d({\n key: \"radarGrid\",\n state: {\n count: 0,\n /** The rim, in px. */\n radius: 0,\n levels: 4,\n /** Inside the outer ring, under the rings and spokes; empty paints nothing. */\n fill: Types.custom<Fill, FillResolved[]>([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n shape: Types.custom<GridShape>(\"polygon\"),\n stroke: Types.custom<Stroke, StrokeResolved[]>([], { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n /** The line out to each category; empty draws none. */\n spokeStroke: Types.custom<Stroke, StrokeResolved[]>([], { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n /** How far the web has grown out, `0`-`1`. Rests at 1 so a paused canvas paints it. */\n reveal: 1,\n },\n defaults: { width: \"fill\", height: \"fill\" },\n load: (loader, state) => loadPaints(loader, { fills: [state.fill], strokes: [state.stroke, state.spokeStroke] }),\n render: (ctx, state) => {\n const grow = clamp(state.reveal, 0, 1)\n const rim = state.radius * grow\n if (rim <= 0 || grow <= 0) return\n const count = Math.max(0, Math.round(state.count))\n const levels = Math.max(1, Math.round(state.levels))\n const round = state.shape === \"circle\" || count < 3\n const outline = (g: Graphics2D, r: number): Graphics2D => {\n if (round) return g.ellipse({ width: r * 2, height: r * 2 })\n const points: Vector2[] = []\n for (let i = 0; i < count; i++) {\n const d = spokeDirection(i, count)\n points.push({ x: d.x * r, y: d.y * r })\n }\n return g.line({ points, closed: true })\n }\n\n if (state.fill.length > 0) ctx.draw(outline(new Graphics2D(), rim).fill(state.fill).opacity(grow))\n\n // One draw per ring: rings chained into one surface would stroke only their union's outline.\n for (let level = 1; state.stroke.length > 0 && level <= levels; level++) {\n const r = (rim * level) / levels\n ctx.draw(outline(new Graphics2D(), r).stroke(state.stroke).opacity(grow))\n }\n\n if (state.spokeStroke.length === 0) return\n for (let i = 0; i < count; i++) {\n const d = spokeDirection(i, count)\n ctx.draw(\n new Graphics2D()\n .line({ points: [{ x: 0, y: 0 }, { x: d.x * rim, y: d.y * rim }] })\n .stroke(state.spokeStroke)\n .opacity(grow)\n )\n }\n },\n})\n\nexport type RadarGrid = NodeOf<typeof RadarGrid>\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type DataRecord, type Size2D, type StrokeResolved, type Stroke as _Stroke, type Vector2 } from "@motionscript/sdk";
|
|
1
|
+
import { type TextStyle, type DataRecord, type Size2D, type StrokeResolved, type Stroke as _Stroke, type Vector2 } from "@motionscript/sdk";
|
|
2
2
|
import { type ChartSeries } from "../kit/shared.js";
|
|
3
3
|
export type GridShape = "polygon" | "circle";
|
|
4
4
|
/** The radar chart's own grid group: the web the polygons are drawn over. */
|
|
@@ -13,6 +13,8 @@ export declare const RADAR_GRID: {
|
|
|
13
13
|
spokeStroke: import("@motionscript/sdk").Type<_Stroke, StrokeResolved[], false>;
|
|
14
14
|
/** Read as the chart is built: whether the category names stand around the rim. */
|
|
15
15
|
spokeLabels: import("@motionscript/sdk").Type<boolean, boolean, false>;
|
|
16
|
+
/** The category names around the rim. */
|
|
17
|
+
spokeText: import("@motionscript/sdk").Type<TextStyle, TextStyle, false>;
|
|
16
18
|
};
|
|
17
19
|
export declare const RADAR_MARKS: {
|
|
18
20
|
/** Outline weight of each series' polygon. */
|
|
@@ -34,7 +36,7 @@ export interface RadarStyle {
|
|
|
34
36
|
readonly areaOpacity: number;
|
|
35
37
|
readonly dots: boolean;
|
|
36
38
|
readonly dotSize: number;
|
|
37
|
-
readonly
|
|
39
|
+
readonly spokeText: TextStyle;
|
|
38
40
|
}
|
|
39
41
|
/** Spoke `index` of `count`, as a unit direction: 12 o'clock first, clockwise on screen, y up. */
|
|
40
42
|
export declare function spokeDirection(index: number, count: number): Vector2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/radar-chart/shared.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,UAAU,EAAE,KAAK,MAAM,EAAE,KAAK,cAAc,EAAE,KAAK,MAAM,IAAI,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,mBAAmB,CAAA;
|
|
1
|
+
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/radar-chart/shared.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Types } from "@motionscript/sdk";
|
|
2
2
|
import { num, text } from "../kit/shared.js";
|
|
3
|
+
import { CHART_MUTED } from "../kit/style.js";
|
|
3
4
|
/** The radar chart's own grid group: the web the polygons are drawn over. */
|
|
4
5
|
export const RADAR_GRID = {
|
|
5
6
|
/** Whether the rings are straight-edged (a polygon through the spokes) or round. */
|
|
@@ -12,6 +13,8 @@ export const RADAR_GRID = {
|
|
|
12
13
|
spokeStroke: Types.stroke({ weight: 2, fill: "white/15" }),
|
|
13
14
|
/** Read as the chart is built: whether the category names stand around the rim. */
|
|
14
15
|
spokeLabels: Types.boolean(true, { animatable: false }),
|
|
16
|
+
/** The category names around the rim. */
|
|
17
|
+
spokeText: Types.typography({ fontSize: 28, fontWeight: 500, fill: CHART_MUTED }),
|
|
15
18
|
};
|
|
16
19
|
export const RADAR_MARKS = {
|
|
17
20
|
/** Outline weight of each series' polygon. */
|