@cfasim-ui/charts 0.7.8 → 0.8.1
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/dist/BarChart/BarChart.d.ts +9 -26
- package/dist/ChartMenu/ChartMenu.d.ts +3 -2
- package/dist/ChartTooltip/ChartTooltip.d.ts +9 -12
- package/dist/ChoroplethMap/ChoroplethMap.d.ts +42 -190
- package/dist/ChoroplethMap/ChoroplethTooltip.d.ts +20 -27
- package/dist/ChoroplethMap/canvasLayer.d.ts +23 -6
- package/dist/ChoroplethMap/cityLayout.d.ts +3 -2
- package/dist/ChoroplethMap/mixedGeo.d.ts +74 -0
- package/dist/ChoroplethMap/mixedGeo.test.d.ts +1 -0
- package/dist/DataTable/DataTable.d.ts +3 -2
- package/dist/LineChart/LineChart.d.ts +9 -26
- package/dist/_shared/ChartAnnotations.d.ts +3 -2
- package/dist/_shared/ChartZoomControls.d.ts +3 -2
- package/dist/_shared/index.d.ts +2 -1
- package/dist/_shared/mapTheme.d.ts +159 -0
- package/dist/_shared/mapTheme.test.d.ts +1 -0
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1821 -1462
- package/docs/BarChart.md +776 -0
- package/docs/ChoroplethMap.md +1394 -0
- package/docs/DataTable.md +386 -0
- package/docs/LineChart.md +1267 -0
- package/docs/index.json +56 -0
- package/package.json +25 -21
- package/src/BarChart/BarChart.md +743 -0
- package/src/BarChart/BarChart.vue +1901 -0
- package/src/ChartMenu/ChartMenu.vue +220 -0
- package/src/ChartMenu/download.ts +120 -0
- package/src/ChartTooltip/ChartTooltip.vue +97 -0
- package/src/ChoroplethMap/ChoroplethMap.md +1354 -0
- package/src/ChoroplethMap/ChoroplethMap.vue +3778 -0
- package/src/ChoroplethMap/ChoroplethTooltip.vue +103 -0
- package/src/ChoroplethMap/canvasLayer.ts +373 -0
- package/src/ChoroplethMap/cityLayout.ts +262 -0
- package/src/ChoroplethMap/hsaMapping.ts +4116 -0
- package/src/ChoroplethMap/mixedGeo.ts +201 -0
- package/src/DataTable/DataTable.md +372 -0
- package/src/DataTable/DataTable.vue +406 -0
- package/src/LineChart/LineChart.md +1225 -0
- package/src/LineChart/LineChart.vue +1555 -0
- package/src/_shared/ChartAnnotations.vue +420 -0
- package/src/_shared/ChartZoomControls.vue +138 -0
- package/src/_shared/annotations.ts +106 -0
- package/src/_shared/axes.ts +69 -0
- package/src/_shared/chartProps.ts +201 -0
- package/src/_shared/computeTicks.ts +42 -0
- package/src/_shared/contrast.ts +100 -0
- package/src/_shared/dateAxis.ts +501 -0
- package/src/_shared/index.ts +78 -0
- package/src/_shared/mapTheme.ts +551 -0
- package/src/_shared/scale.ts +86 -0
- package/src/_shared/seriesCsv.ts +68 -0
- package/src/_shared/touch.ts +8 -0
- package/src/_shared/useChartFoundation.ts +175 -0
- package/src/_shared/useChartFullscreen.ts +254 -0
- package/src/_shared/useChartMenu.ts +111 -0
- package/src/_shared/useChartPadding.ts +235 -0
- package/src/_shared/useChartSize.ts +58 -0
- package/src/_shared/useChartTooltip.ts +205 -0
- package/src/env.d.ts +4 -0
- package/src/hsa-mapping.ts +1 -0
- package/src/index.ts +41 -0
- package/src/tooltip-position.ts +55 -0
- package/src/us-cities/data.ts +1371 -0
- package/src/us-cities/index.ts +122 -0
- package/src/us-cities.ts +7 -0
|
@@ -228,26 +228,12 @@ interface BarChartProps extends ChartCommonProps {
|
|
|
228
228
|
*/
|
|
229
229
|
valueHeader?: string;
|
|
230
230
|
}
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
category: string;
|
|
236
|
-
}): unknown;
|
|
237
|
-
}> & {
|
|
238
|
-
tooltip?(props: ChartTooltipBaseProps & {
|
|
239
|
-
category: string;
|
|
240
|
-
}): unknown;
|
|
241
|
-
};
|
|
242
|
-
refs: {
|
|
243
|
-
containerRef: HTMLDivElement;
|
|
244
|
-
svgRef: SVGSVGElement;
|
|
245
|
-
tooltipRef: HTMLDivElement;
|
|
246
|
-
};
|
|
247
|
-
rootEl: any;
|
|
231
|
+
type __VLS_Slots = {
|
|
232
|
+
tooltip?(props: ChartTooltipBaseProps & {
|
|
233
|
+
category: string;
|
|
234
|
+
}): unknown;
|
|
248
235
|
};
|
|
249
|
-
|
|
250
|
-
declare const __VLS_component: import('vue').DefineComponent<BarChartProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
236
|
+
declare const __VLS_base: import('vue').DefineComponent<BarChartProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
251
237
|
hover: (payload: ChartHoverPayload) => any;
|
|
252
238
|
}, string, import('vue').PublicProps, Readonly<BarChartProps> & Readonly<{
|
|
253
239
|
onHover?: ((payload: ChartHoverPayload) => any) | undefined;
|
|
@@ -262,14 +248,11 @@ declare const __VLS_component: import('vue').DefineComponent<BarChartProps, {},
|
|
|
262
248
|
groupGap: number;
|
|
263
249
|
valueGrid: boolean;
|
|
264
250
|
valueAxis: boolean;
|
|
265
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
tooltipRef: HTMLDivElement;
|
|
269
|
-
}, any>;
|
|
270
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
251
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
252
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
253
|
+
declare const _default: typeof __VLS_export;
|
|
271
254
|
export default _default;
|
|
272
|
-
type
|
|
255
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
273
256
|
new (): {
|
|
274
257
|
$slots: S;
|
|
275
258
|
};
|
|
@@ -14,12 +14,13 @@ type __VLS_Props = {
|
|
|
14
14
|
*/
|
|
15
15
|
isFullscreen?: boolean;
|
|
16
16
|
};
|
|
17
|
-
declare const
|
|
17
|
+
declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
18
18
|
close: () => any;
|
|
19
19
|
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
20
20
|
onClose?: (() => any) | undefined;
|
|
21
21
|
}>, {
|
|
22
22
|
forceDropdown: boolean;
|
|
23
23
|
isFullscreen: boolean;
|
|
24
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {},
|
|
24
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
25
|
+
declare const _default: typeof __VLS_export;
|
|
25
26
|
export default _default;
|
|
@@ -10,17 +10,13 @@ type __VLS_Props = {
|
|
|
10
10
|
/** Offset from anchor in pixels. Default: 8 */
|
|
11
11
|
sideOffset?: number;
|
|
12
12
|
};
|
|
13
|
-
declare
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
};
|
|
19
|
-
refs: {};
|
|
20
|
-
rootEl: any;
|
|
13
|
+
declare var __VLS_1: {}, __VLS_31: {};
|
|
14
|
+
type __VLS_Slots = {} & {
|
|
15
|
+
default?: (props: typeof __VLS_1) => any;
|
|
16
|
+
} & {
|
|
17
|
+
default?: (props: typeof __VLS_31) => any;
|
|
21
18
|
};
|
|
22
|
-
|
|
23
|
-
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
19
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
24
20
|
close: () => any;
|
|
25
21
|
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
26
22
|
onClose?: (() => any) | undefined;
|
|
@@ -28,9 +24,10 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
|
|
|
28
24
|
sideOffset: number;
|
|
29
25
|
mode: "hover" | "click";
|
|
30
26
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
31
|
-
declare const
|
|
27
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
28
|
+
declare const _default: typeof __VLS_export;
|
|
32
29
|
export default _default;
|
|
33
|
-
type
|
|
30
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
34
31
|
new (): {
|
|
35
32
|
$slots: S;
|
|
36
33
|
};
|
|
@@ -1,23 +1,36 @@
|
|
|
1
|
-
import { nextTick } from 'vue';
|
|
2
1
|
import { Topology } from 'topojson-specification';
|
|
3
2
|
import { NumberFormat } from '@cfasim-ui/shared';
|
|
4
|
-
import { TitleStyle, LabelStyle } from '../_shared/index.js';
|
|
3
|
+
import { MapTheme, TitleStyle, LabelStyle } from '../_shared/index.js';
|
|
5
4
|
import { CityMarker } from './cityLayout.js';
|
|
6
5
|
export type GeoType = "states" | "counties" | "hsas";
|
|
7
6
|
export interface StateData {
|
|
8
7
|
/** FIPS code (e.g. "06" for California, "04015" for a county) or name */
|
|
9
8
|
id: string;
|
|
10
9
|
value: number | string;
|
|
10
|
+
/**
|
|
11
|
+
* Geographic level of *this row*, when it differs from the map's `geoType`.
|
|
12
|
+
* The state the row belongs to is then re-tiled at this level: on a county
|
|
13
|
+
* map, `{ id: "06", geoType: "states" }` draws California as one merged
|
|
14
|
+
* shape carrying this value; on a state map, `{ id: "36061", geoType:
|
|
15
|
+
* "counties" }` breaks New York out into its counties. Rows at the base
|
|
16
|
+
* level (the common case) leave `geoType` unset. Ignores `dataGeoType` —
|
|
17
|
+
* an off-level row is looked up by its own id.
|
|
18
|
+
*/
|
|
19
|
+
geoType?: GeoType;
|
|
11
20
|
}
|
|
12
21
|
export interface ChoroplethColorScale {
|
|
13
|
-
/**
|
|
22
|
+
/**
|
|
23
|
+
* Minimum color. Any CSS color, including `var()` and `light-dark()`,
|
|
24
|
+
* resolved against the map's container. Default: "#e5f0fa"
|
|
25
|
+
*/
|
|
14
26
|
min?: string;
|
|
15
|
-
/** Maximum color (CSS color
|
|
27
|
+
/** Maximum color (any CSS color, as `min`). Default: "#08519c" */
|
|
16
28
|
max?: string;
|
|
17
29
|
}
|
|
18
30
|
export interface ThresholdStop {
|
|
19
31
|
/** Lower bound (inclusive). Values at or above this threshold get this color. */
|
|
20
32
|
min: number;
|
|
33
|
+
/** Any CSS color, including `var()` and `light-dark()`. */
|
|
21
34
|
color: string;
|
|
22
35
|
/** Optional label for the legend (defaults to the min value) */
|
|
23
36
|
label?: string;
|
|
@@ -25,7 +38,7 @@ export interface ThresholdStop {
|
|
|
25
38
|
export interface CategoricalStop {
|
|
26
39
|
/** The categorical value to match */
|
|
27
40
|
value: string;
|
|
28
|
-
/** CSS color
|
|
41
|
+
/** Any CSS color, including `var()` and `light-dark()`. */
|
|
29
42
|
color: string;
|
|
30
43
|
}
|
|
31
44
|
/**
|
|
@@ -46,8 +59,8 @@ export interface FocusItem {
|
|
|
46
59
|
* useful when stacking multiple outlines of different geoTypes. */
|
|
47
60
|
style?: FocusStyle;
|
|
48
61
|
/** Stroke color for the outline. In-place highlights (items in the
|
|
49
|
-
* base geoType) default to pure black/white
|
|
50
|
-
*
|
|
62
|
+
* base geoType) default to the theme's `highlight` (pure black/white
|
|
63
|
+
* following the color scheme); cross-geoType overlay paths default to
|
|
51
64
|
* `"#fff"`. */
|
|
52
65
|
stroke?: string;
|
|
53
66
|
/** Outline width in CSS px. Defaults to the map's stroke width + 1
|
|
@@ -69,7 +82,10 @@ type __VLS_Props = {
|
|
|
69
82
|
* with its parent HSA's value) or by state values, without changing
|
|
70
83
|
* the rendered/interactive geometry. Supported combinations:
|
|
71
84
|
* `counties` ← `hsas`, `counties` ← `states`, `hsas` ← `states`.
|
|
72
|
-
* When unset, data ids must match the base `geoType`.
|
|
85
|
+
* When unset, data ids must match the base `geoType`. Re-keys the whole
|
|
86
|
+
* dataset — to mix levels on one map (a county map where California
|
|
87
|
+
* reports one statewide value), set `geoType` on the individual rows
|
|
88
|
+
* instead.
|
|
73
89
|
*/
|
|
74
90
|
dataGeoType?: GeoType;
|
|
75
91
|
/**
|
|
@@ -118,9 +134,17 @@ type __VLS_Props = {
|
|
|
118
134
|
ariaLabel?: string;
|
|
119
135
|
/** Styling for the legend (title, swatch labels, and continuous-scale ticks). */
|
|
120
136
|
legendStyle?: LabelStyle;
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
137
|
+
/**
|
|
138
|
+
* Map paint styling: base fill for features without data, feature
|
|
139
|
+
* strokes, the state-borders mesh, an exterior outline, a background
|
|
140
|
+
* wash, and the hover/focus highlight. Every color accepts any CSS
|
|
141
|
+
* color (`var()`, `light-dark()`, `color-mix()`), resolved against
|
|
142
|
+
* the map's container and re-applied automatically when the page
|
|
143
|
+
* theme changes. Defaults route through `--choropleth-*` custom
|
|
144
|
+
* properties (e.g. `--choropleth-outline` enables the exterior
|
|
145
|
+
* outline), so a stylesheet alone can theme every map. See `MapTheme`.
|
|
146
|
+
*/
|
|
147
|
+
theme?: MapTheme;
|
|
124
148
|
menu?: boolean | string;
|
|
125
149
|
/** Show legend. Default: true */
|
|
126
150
|
legend?: boolean;
|
|
@@ -269,99 +293,10 @@ interface TooltipPayload {
|
|
|
269
293
|
value?: number | string;
|
|
270
294
|
feature: ChoroplethFeature;
|
|
271
295
|
}
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
slots: Readonly<{
|
|
275
|
-
tooltip?(props: TooltipPayload): unknown;
|
|
276
|
-
}> & {
|
|
277
|
-
tooltip?(props: TooltipPayload): unknown;
|
|
278
|
-
};
|
|
279
|
-
refs: {
|
|
280
|
-
containerRef: HTMLDivElement;
|
|
281
|
-
canvasRef: HTMLCanvasElement;
|
|
282
|
-
svgRef: SVGSVGElement;
|
|
283
|
-
mapGroupRef: SVGGElement;
|
|
284
|
-
baseGroupRef: SVGGElement;
|
|
285
|
-
overlayGroupRef: SVGGElement;
|
|
286
|
-
cityOverlayRef: SVGSVGElement;
|
|
287
|
-
cityLayerRef: SVGGElement;
|
|
288
|
-
tooltipChildRef: ({
|
|
289
|
-
$: import('vue').ComponentInternalInstance;
|
|
290
|
-
$data: {};
|
|
291
|
-
$props: {
|
|
292
|
-
readonly mode?: "float" | "sheet" | undefined;
|
|
293
|
-
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
|
|
294
|
-
$attrs: import('vue').Attrs;
|
|
295
|
-
$refs: {
|
|
296
|
-
[x: string]: unknown;
|
|
297
|
-
} & {
|
|
298
|
-
root: HTMLDivElement;
|
|
299
|
-
};
|
|
300
|
-
$slots: Readonly<{
|
|
301
|
-
[name: string]: import('vue').Slot<any> | undefined;
|
|
302
|
-
}>;
|
|
303
|
-
$root: import('vue').ComponentPublicInstance | null;
|
|
304
|
-
$parent: import('vue').ComponentPublicInstance | null;
|
|
305
|
-
$host: Element | null;
|
|
306
|
-
$emit: (event: string, ...args: any[]) => void;
|
|
307
|
-
$el: any;
|
|
308
|
-
$options: import('vue').ComponentOptionsBase<Readonly<{
|
|
309
|
-
mode?: "float" | "sheet";
|
|
310
|
-
}> & Readonly<{}>, {
|
|
311
|
-
setData(next: import('./ChoroplethTooltip').ChoroplethTooltipData | null): void;
|
|
312
|
-
setOpen(next: boolean): void;
|
|
313
|
-
getEl(): HTMLDivElement | null;
|
|
314
|
-
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
|
|
315
|
-
mode: "float" | "sheet";
|
|
316
|
-
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
|
|
317
|
-
beforeCreate?: (() => void) | (() => void)[];
|
|
318
|
-
created?: (() => void) | (() => void)[];
|
|
319
|
-
beforeMount?: (() => void) | (() => void)[];
|
|
320
|
-
mounted?: (() => void) | (() => void)[];
|
|
321
|
-
beforeUpdate?: (() => void) | (() => void)[];
|
|
322
|
-
updated?: (() => void) | (() => void)[];
|
|
323
|
-
activated?: (() => void) | (() => void)[];
|
|
324
|
-
deactivated?: (() => void) | (() => void)[];
|
|
325
|
-
beforeDestroy?: (() => void) | (() => void)[];
|
|
326
|
-
beforeUnmount?: (() => void) | (() => void)[];
|
|
327
|
-
destroyed?: (() => void) | (() => void)[];
|
|
328
|
-
unmounted?: (() => void) | (() => void)[];
|
|
329
|
-
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
330
|
-
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
331
|
-
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
|
|
332
|
-
};
|
|
333
|
-
$forceUpdate: () => void;
|
|
334
|
-
$nextTick: typeof nextTick;
|
|
335
|
-
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
|
|
336
|
-
} & Readonly<{
|
|
337
|
-
mode: "float" | "sheet";
|
|
338
|
-
}> & Omit<Readonly<{
|
|
339
|
-
mode?: "float" | "sheet";
|
|
340
|
-
}> & Readonly<{}>, "mode" | "setData" | "setOpen" | "getEl"> & {
|
|
341
|
-
setData: (next: import('./ChoroplethTooltip').ChoroplethTooltipData | null) => void;
|
|
342
|
-
setOpen: (next: boolean) => void;
|
|
343
|
-
getEl: () => HTMLDivElement | null;
|
|
344
|
-
} & {} & import('vue').ComponentCustomProperties & {} & {
|
|
345
|
-
$slots: {
|
|
346
|
-
default?(_: {
|
|
347
|
-
id: string;
|
|
348
|
-
name: string;
|
|
349
|
-
value?: number | string | undefined;
|
|
350
|
-
feature: unknown;
|
|
351
|
-
}): any;
|
|
352
|
-
default?(_: {
|
|
353
|
-
id: string;
|
|
354
|
-
name: string;
|
|
355
|
-
value?: number | string | undefined;
|
|
356
|
-
feature: unknown;
|
|
357
|
-
}): any;
|
|
358
|
-
};
|
|
359
|
-
}) | null;
|
|
360
|
-
};
|
|
361
|
-
rootEl: any;
|
|
296
|
+
type __VLS_Slots = {
|
|
297
|
+
tooltip?(props: TooltipPayload): unknown;
|
|
362
298
|
};
|
|
363
|
-
|
|
364
|
-
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
299
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
365
300
|
stateClick: (state: {
|
|
366
301
|
id: string;
|
|
367
302
|
name: string;
|
|
@@ -389,11 +324,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
|
|
|
389
324
|
legend: boolean;
|
|
390
325
|
menu: boolean | string;
|
|
391
326
|
tooltipClamp: "none" | "chart" | "window";
|
|
392
|
-
strokeWidth: number;
|
|
393
327
|
geoType: GeoType;
|
|
394
328
|
tightFit: boolean | number;
|
|
395
|
-
noDataColor: string;
|
|
396
|
-
strokeColor: string;
|
|
397
329
|
zoom: boolean;
|
|
398
330
|
zoomMode: "activate" | "scroll";
|
|
399
331
|
touchExpand: boolean;
|
|
@@ -402,91 +334,11 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
|
|
|
402
334
|
focusZoom: boolean;
|
|
403
335
|
renderer: "svg" | "canvas";
|
|
404
336
|
citiesMinZoom: number;
|
|
405
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
svgRef: SVGSVGElement;
|
|
409
|
-
mapGroupRef: SVGGElement;
|
|
410
|
-
baseGroupRef: SVGGElement;
|
|
411
|
-
overlayGroupRef: SVGGElement;
|
|
412
|
-
cityOverlayRef: SVGSVGElement;
|
|
413
|
-
cityLayerRef: SVGGElement;
|
|
414
|
-
tooltipChildRef: ({
|
|
415
|
-
$: import('vue').ComponentInternalInstance;
|
|
416
|
-
$data: {};
|
|
417
|
-
$props: {
|
|
418
|
-
readonly mode?: "float" | "sheet" | undefined;
|
|
419
|
-
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
|
|
420
|
-
$attrs: import('vue').Attrs;
|
|
421
|
-
$refs: {
|
|
422
|
-
[x: string]: unknown;
|
|
423
|
-
} & {
|
|
424
|
-
root: HTMLDivElement;
|
|
425
|
-
};
|
|
426
|
-
$slots: Readonly<{
|
|
427
|
-
[name: string]: import('vue').Slot<any> | undefined;
|
|
428
|
-
}>;
|
|
429
|
-
$root: import('vue').ComponentPublicInstance | null;
|
|
430
|
-
$parent: import('vue').ComponentPublicInstance | null;
|
|
431
|
-
$host: Element | null;
|
|
432
|
-
$emit: (event: string, ...args: any[]) => void;
|
|
433
|
-
$el: any;
|
|
434
|
-
$options: import('vue').ComponentOptionsBase<Readonly<{
|
|
435
|
-
mode?: "float" | "sheet";
|
|
436
|
-
}> & Readonly<{}>, {
|
|
437
|
-
setData(next: import('./ChoroplethTooltip').ChoroplethTooltipData | null): void;
|
|
438
|
-
setOpen(next: boolean): void;
|
|
439
|
-
getEl(): HTMLDivElement | null;
|
|
440
|
-
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
|
|
441
|
-
mode: "float" | "sheet";
|
|
442
|
-
}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
|
|
443
|
-
beforeCreate?: (() => void) | (() => void)[];
|
|
444
|
-
created?: (() => void) | (() => void)[];
|
|
445
|
-
beforeMount?: (() => void) | (() => void)[];
|
|
446
|
-
mounted?: (() => void) | (() => void)[];
|
|
447
|
-
beforeUpdate?: (() => void) | (() => void)[];
|
|
448
|
-
updated?: (() => void) | (() => void)[];
|
|
449
|
-
activated?: (() => void) | (() => void)[];
|
|
450
|
-
deactivated?: (() => void) | (() => void)[];
|
|
451
|
-
beforeDestroy?: (() => void) | (() => void)[];
|
|
452
|
-
beforeUnmount?: (() => void) | (() => void)[];
|
|
453
|
-
destroyed?: (() => void) | (() => void)[];
|
|
454
|
-
unmounted?: (() => void) | (() => void)[];
|
|
455
|
-
renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
456
|
-
renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
|
|
457
|
-
errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
|
|
458
|
-
};
|
|
459
|
-
$forceUpdate: () => void;
|
|
460
|
-
$nextTick: typeof nextTick;
|
|
461
|
-
$watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
|
|
462
|
-
} & Readonly<{
|
|
463
|
-
mode: "float" | "sheet";
|
|
464
|
-
}> & Omit<Readonly<{
|
|
465
|
-
mode?: "float" | "sheet";
|
|
466
|
-
}> & Readonly<{}>, "mode" | "setData" | "setOpen" | "getEl"> & {
|
|
467
|
-
setData: (next: import('./ChoroplethTooltip').ChoroplethTooltipData | null) => void;
|
|
468
|
-
setOpen: (next: boolean) => void;
|
|
469
|
-
getEl: () => HTMLDivElement | null;
|
|
470
|
-
} & {} & import('vue').ComponentCustomProperties & {} & {
|
|
471
|
-
$slots: {
|
|
472
|
-
default?(_: {
|
|
473
|
-
id: string;
|
|
474
|
-
name: string;
|
|
475
|
-
value?: number | string | undefined;
|
|
476
|
-
feature: unknown;
|
|
477
|
-
}): any;
|
|
478
|
-
default?(_: {
|
|
479
|
-
id: string;
|
|
480
|
-
name: string;
|
|
481
|
-
value?: number | string | undefined;
|
|
482
|
-
feature: unknown;
|
|
483
|
-
}): any;
|
|
484
|
-
};
|
|
485
|
-
}) | null;
|
|
486
|
-
}, any>;
|
|
487
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
337
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
338
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
339
|
+
declare const _default: typeof __VLS_export;
|
|
488
340
|
export default _default;
|
|
489
|
-
type
|
|
341
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
490
342
|
new (): {
|
|
491
343
|
$slots: S;
|
|
492
344
|
};
|
|
@@ -15,41 +15,34 @@ type __VLS_Props = {
|
|
|
15
15
|
*/
|
|
16
16
|
mode?: "float" | "sheet";
|
|
17
17
|
};
|
|
18
|
-
declare
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
};
|
|
34
|
-
refs: {
|
|
35
|
-
root: HTMLDivElement;
|
|
36
|
-
};
|
|
37
|
-
rootEl: any;
|
|
18
|
+
declare var __VLS_7: {
|
|
19
|
+
id: string;
|
|
20
|
+
name: string;
|
|
21
|
+
value?: number | string | undefined;
|
|
22
|
+
feature: unknown;
|
|
23
|
+
}, __VLS_9: {
|
|
24
|
+
id: string;
|
|
25
|
+
name: string;
|
|
26
|
+
value?: number | string | undefined;
|
|
27
|
+
feature: unknown;
|
|
28
|
+
};
|
|
29
|
+
type __VLS_Slots = {} & {
|
|
30
|
+
default?: (props: typeof __VLS_7) => any;
|
|
31
|
+
} & {
|
|
32
|
+
default?: (props: typeof __VLS_9) => any;
|
|
38
33
|
};
|
|
39
|
-
|
|
40
|
-
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {
|
|
34
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
41
35
|
setData(next: ChoroplethTooltipData | null): void;
|
|
42
36
|
/** Sheet-mode visibility (float mode is driven imperatively via getEl). */
|
|
43
37
|
setOpen(next: boolean): void;
|
|
44
38
|
getEl(): HTMLDivElement | null;
|
|
45
39
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
46
40
|
mode: "float" | "sheet";
|
|
47
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
41
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
42
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
43
|
+
declare const _default: typeof __VLS_export;
|
|
51
44
|
export default _default;
|
|
52
|
-
type
|
|
45
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
53
46
|
new (): {
|
|
54
47
|
$slots: S;
|
|
55
48
|
};
|
|
@@ -9,13 +9,19 @@ export interface CanvasScene {
|
|
|
9
9
|
items: SceneItem[];
|
|
10
10
|
indexById: Map<string, number>;
|
|
11
11
|
/**
|
|
12
|
-
* Every feature
|
|
12
|
+
* Every feature stroke concatenated into one path — features share a
|
|
13
13
|
* stroke color, and one native stroke call beats thousands (WebKit's
|
|
14
14
|
* canvas2D especially).
|
|
15
15
|
*/
|
|
16
|
-
|
|
16
|
+
featureStrokes: Path2D | null;
|
|
17
17
|
/** State-borders mesh (counties / hsas mode). */
|
|
18
18
|
borders: Path2D | null;
|
|
19
|
+
/**
|
|
20
|
+
* Exterior boundary of the rendered geography (theme.outline). Built
|
|
21
|
+
* lazily by the component when the outline resolves visible, so it is
|
|
22
|
+
* mutable scene state rather than a buildScene input.
|
|
23
|
+
*/
|
|
24
|
+
exterior: Path2D | null;
|
|
19
25
|
}
|
|
20
26
|
export interface CanvasView {
|
|
21
27
|
dpr: number;
|
|
@@ -45,6 +51,16 @@ export interface CanvasBaseState {
|
|
|
45
51
|
strokeColor: string;
|
|
46
52
|
/** Base feature stroke width in CSS px (effectiveStrokeWidth). */
|
|
47
53
|
strokeWidth: number;
|
|
54
|
+
/** State-borders mesh color (resolved theme.borders). */
|
|
55
|
+
bordersColor: string;
|
|
56
|
+
/** State-borders mesh width in CSS px; 0 disables. */
|
|
57
|
+
bordersWidth: number;
|
|
58
|
+
/** Exterior outline color; undefined = off (resolved theme.outline). */
|
|
59
|
+
outlineColor: string | undefined;
|
|
60
|
+
/** Exterior outline width in CSS px; 0 disables. */
|
|
61
|
+
outlineWidth: number;
|
|
62
|
+
/** Background wash painted before fills; undefined = off. */
|
|
63
|
+
background: string | undefined;
|
|
48
64
|
/** Resolved highlight color (light-dark() can't paint on canvas). */
|
|
49
65
|
highlightStroke: string;
|
|
50
66
|
focused: Map<string, CanvasHighlightItem>;
|
|
@@ -60,10 +76,11 @@ export declare function buildScene(features: Array<{
|
|
|
60
76
|
* base (focused features are already highlighted in the base itself). */
|
|
61
77
|
export declare function drawHoverHighlight(ctx: CanvasRenderingContext2D, scene: CanvasScene, view: CanvasView, state: CanvasBaseState, hoveredId: string | null): void;
|
|
62
78
|
/**
|
|
63
|
-
* Everything but the transient hover: clear,
|
|
64
|
-
* highlights, overlays. Split out
|
|
65
|
-
*
|
|
66
|
-
* highlight instead of
|
|
79
|
+
* Everything but the transient hover: clear, background, fills, feature
|
|
80
|
+
* strokes, borders, exterior outline, focus highlights, overlays. Split out
|
|
81
|
+
* so the component can cache this to an offscreen canvas and, on a
|
|
82
|
+
* hover-only change, blit it back + redraw the one highlight instead of
|
|
83
|
+
* re-filling every feature.
|
|
67
84
|
*/
|
|
68
85
|
export declare function drawBase(ctx: CanvasRenderingContext2D, scene: CanvasScene, view: CanvasView, state: CanvasDrawState): void;
|
|
69
86
|
/** One-shot full repaint: the base pass plus the hover highlight on top. */
|
|
@@ -4,8 +4,9 @@ export interface CityMarker {
|
|
|
4
4
|
coordinates: [number, number];
|
|
5
5
|
/**
|
|
6
6
|
* Mark as a capital: the label gets first pick during placement and is never
|
|
7
|
-
* dropped for collisions
|
|
8
|
-
*
|
|
7
|
+
* dropped for collisions. It renders like any other label (with a
|
|
8
|
+
* `choropleth-city-label-capital` class to style if you want), and the marker
|
|
9
|
+
* is a plain dot, same as any other city.
|
|
9
10
|
*/
|
|
10
11
|
capital?: boolean;
|
|
11
12
|
/**
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import { GeoType } from './ChoroplethMap';
|
|
2
|
+
/** Minimal shape of the GeoJSON features this module shuffles around. */
|
|
3
|
+
export interface MixFeature {
|
|
4
|
+
id?: string | number | null;
|
|
5
|
+
properties?: {
|
|
6
|
+
name?: string;
|
|
7
|
+
} | null;
|
|
8
|
+
}
|
|
9
|
+
/** id → feature and name → id indexes for one geographic level. */
|
|
10
|
+
export interface LevelLookup<F extends MixFeature = MixFeature> {
|
|
11
|
+
byId: Map<string, F>;
|
|
12
|
+
byName: Map<string, string>;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Lazily resolves the lookup for a level, so a map that never mixes never pays
|
|
16
|
+
* to index the levels it doesn't render. Returns null when the topology can't
|
|
17
|
+
* supply that level (e.g. "counties" from a states-only topology, or "hsas"
|
|
18
|
+
* before the lazy HSA chunk loads).
|
|
19
|
+
*/
|
|
20
|
+
export type LevelResolver<F extends MixFeature = MixFeature> = (level: GeoType) => LevelLookup<F> | null;
|
|
21
|
+
/**
|
|
22
|
+
* 2-digit state FIPS a feature id belongs to, or null when it can't be
|
|
23
|
+
* determined. States and counties carry it as their first two digits; HSA
|
|
24
|
+
* codes need the FIPS→HSA table (inverted into `hsaToState`), because an HSA
|
|
25
|
+
* code isn't state-prefixed. No HSA spans two states, so the mapping is total.
|
|
26
|
+
*/
|
|
27
|
+
export declare function stateOfId(level: GeoType, id: string, hsaToState?: ReadonlyMap<string, string> | null): string | null;
|
|
28
|
+
/** A `data` row as far as mixing is concerned. */
|
|
29
|
+
export interface MixRow {
|
|
30
|
+
id: string;
|
|
31
|
+
geoType?: GeoType;
|
|
32
|
+
}
|
|
33
|
+
export interface OverrideResolution {
|
|
34
|
+
/** state FIPS → the level that state renders at. */
|
|
35
|
+
overrides: Map<string, GeoType>;
|
|
36
|
+
/** Row ids whose state couldn't be resolved (bad id, or level unavailable). */
|
|
37
|
+
unresolved: string[];
|
|
38
|
+
/**
|
|
39
|
+
* Row ids that named an already-claimed state at a different level. The first
|
|
40
|
+
* row wins; these are reported so the caller can warn.
|
|
41
|
+
*/
|
|
42
|
+
conflicts: string[];
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Collects the per-state level overrides implied by `rows`. Rows without a
|
|
46
|
+
* `geoType`, or whose `geoType` matches the base map, are plain data and are
|
|
47
|
+
* ignored here.
|
|
48
|
+
*/
|
|
49
|
+
export declare function resolveGeoOverrides(rows: readonly MixRow[] | undefined, baseGeoType: GeoType, getLevel: LevelResolver, hsaToState?: ReadonlyMap<string, string> | null): OverrideResolution;
|
|
50
|
+
/**
|
|
51
|
+
* Serializes overrides into a comparable key. The caller derives the override
|
|
52
|
+
* map from this string so its identity only changes when the *set* of overrides
|
|
53
|
+
* does — otherwise every `data` update would rebuild the whole feature tree.
|
|
54
|
+
*/
|
|
55
|
+
export declare function serializeOverrides(overrides: Map<string, GeoType>): string;
|
|
56
|
+
/** Inverse of `serializeOverrides`. */
|
|
57
|
+
export declare function parseOverrides(key: string): Map<string, GeoType>;
|
|
58
|
+
export interface MixedFeatures<F extends MixFeature> {
|
|
59
|
+
features: F[];
|
|
60
|
+
/**
|
|
61
|
+
* Feature id → level, for substituted features only. Ids absent from the map
|
|
62
|
+
* render at the base `geoType`.
|
|
63
|
+
*/
|
|
64
|
+
levelById: Map<string, GeoType>;
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* Replaces every overridden state's base features with that state's features at
|
|
68
|
+
* the override level. Returns `base` untouched when there's nothing to mix, so
|
|
69
|
+
* the common case costs one `size` check.
|
|
70
|
+
*
|
|
71
|
+
* `scopeFips` mirrors the map's single-state mode: substituted features outside
|
|
72
|
+
* the scoped state are dropped, exactly as the base set already is.
|
|
73
|
+
*/
|
|
74
|
+
export declare function mixFeatures<F extends MixFeature>(base: readonly F[], baseGeoType: GeoType, overrides: Map<string, GeoType>, getLevel: LevelResolver<F>, hsaToState?: ReadonlyMap<string, string> | null, scopeFips?: string | null): MixedFeatures<F>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -71,10 +71,11 @@ type __VLS_Props = {
|
|
|
71
71
|
/** Stretch the table to fill its container's width. */
|
|
72
72
|
fullWidth?: boolean;
|
|
73
73
|
};
|
|
74
|
-
declare const
|
|
74
|
+
declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
75
75
|
menu: boolean | string;
|
|
76
76
|
downloadButton: boolean;
|
|
77
77
|
downloadMenuLink: string;
|
|
78
78
|
fullWidth: boolean;
|
|
79
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {},
|
|
79
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
80
|
+
declare const _default: typeof __VLS_export;
|
|
80
81
|
export default _default;
|