@fundar/data-chart-telling 0.0.14 → 0.0.16
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/README.md +121 -17
- package/dist/charts/{Chart.svelte → BaseChart.svelte} +2 -0
- package/dist/charts/{Chart.svelte.d.ts → BaseChart.svelte.d.ts} +3 -3
- package/dist/charts/bar/Chart.svelte +5 -5
- package/dist/charts/bar/Chart.svelte.d.ts +1 -2
- package/dist/charts/heatmap/Chart.svelte +8 -7
- package/dist/charts/heatmap/Chart.svelte.d.ts +2 -3
- package/dist/charts/line/Chart.svelte +5 -5
- package/dist/charts/line/Chart.svelte.d.ts +1 -2
- package/dist/charts/pyramid/Chart.svelte +7 -6
- package/dist/charts/pyramid/Chart.svelte.d.ts +2 -3
- package/dist/configuration/config.svelte.js +2 -1
- package/dist/configuration/themes/index.d.ts +60 -40
- package/dist/index.d.ts +27 -13
- package/dist/index.js +12 -7
- package/dist/layout/facet/FacetLayout.svelte +1 -1
- package/dist/layout/facet/FacetLayout.svelte.d.ts +1 -1
- package/dist/layout/geo/GeoLayout.svelte +47 -0
- package/dist/layout/geo/GeoLayout.svelte.d.ts +22 -0
- package/dist/layout/geo/resolveProjection.d.ts +10 -0
- package/dist/layout/geo/resolveProjection.js +48 -0
- package/dist/layout/legend/ContinuousSection.svelte +158 -17
- package/dist/layout/legend/DiscreteSection.svelte +56 -4
- package/dist/layout/legend/interaction.svelte.d.ts +7 -0
- package/dist/layout/legend/interaction.svelte.js +24 -0
- package/dist/layout/plot/AxisLayout.svelte +95 -0
- package/dist/layout/plot/AxisLayout.svelte.d.ts +39 -0
- package/dist/layout/plot/BasePlotLayout.svelte +302 -0
- package/dist/layout/plot/BasePlotLayout.svelte.d.ts +95 -0
- package/dist/layout/plot/GridLayout.svelte +30 -0
- package/dist/layout/plot/GridLayout.svelte.d.ts +27 -0
- package/dist/layout/plot/RuleLayout.svelte +111 -0
- package/dist/layout/plot/RuleLayout.svelte.d.ts +40 -0
- package/dist/layout/plot/margins.d.ts +34 -0
- package/dist/layout/plot/margins.js +26 -0
- package/dist/layout/timeline/TimelineLayout.svelte +1 -1
- package/dist/layout/timeline/TimelineLayout.svelte.d.ts +1 -1
- package/dist/layout/tooltip/Tooltip.svelte +15 -0
- package/dist/layout/tooltip/Tooltip.svelte.d.ts +7 -0
- package/dist/layout/tooltip/TooltipLayout.svelte +45 -0
- package/dist/layout/tooltip/TooltipLayout.svelte.d.ts +41 -0
- package/dist/layout/tooltip/controller.svelte.d.ts +4 -3
- package/dist/layout/tooltip/controller.svelte.js +5 -6
- package/dist/layout/tooltip/hover.svelte.d.ts +1 -1
- package/dist/layout/tooltip/hover.svelte.js +1 -1
- package/dist/layout/tooltip/utils.d.ts +2 -2
- package/dist/markers/ContourClipMarker.svelte +77 -0
- package/dist/markers/ContourClipMarker.svelte.d.ts +10 -0
- package/dist/{plots/markers → markers}/DeltaMarker.svelte +4 -4
- package/dist/{plots/markers → markers}/DeltaMarker.svelte.d.ts +3 -3
- package/dist/{plots/markers → markers}/DotMarker.svelte +3 -3
- package/dist/{plots/markers → markers}/DotMarker.svelte.d.ts +3 -3
- package/dist/markers/HoverMarker.svelte +136 -0
- package/dist/{plots/markers → markers}/HoverMarker.svelte.d.ts +4 -4
- package/dist/{plots/markers → markers}/PeakMarker.svelte +2 -2
- package/dist/{plots/markers → markers}/PeakMarker.svelte.d.ts +2 -2
- package/dist/{plots/markers → markers}/TextMarker.svelte +11 -4
- package/dist/{plots/markers → markers}/TextMarker.svelte.d.ts +3 -3
- package/dist/markers/inset/InsetMarker.svelte +170 -0
- package/dist/markers/inset/InsetMarker.svelte.d.ts +51 -0
- package/dist/markers/inset/insetLayout.d.ts +25 -0
- package/dist/markers/inset/insetLayout.js +39 -0
- package/dist/markers/inset/insetProjection.d.ts +8 -0
- package/dist/markers/inset/insetProjection.js +39 -0
- package/dist/plots/bar/BarSegments.svelte +69 -0
- package/dist/plots/bar/BarSegments.svelte.d.ts +40 -0
- package/dist/plots/bar/Plot.svelte +140 -74
- package/dist/plots/bar/Plot.svelte.d.ts +7 -3
- package/dist/plots/bar/ValueLabels.svelte +89 -0
- package/dist/plots/bar/ValueLabels.svelte.d.ts +39 -0
- package/dist/plots/bar/hoverPoints.d.ts +15 -0
- package/dist/plots/bar/hoverPoints.js +35 -0
- package/dist/plots/bar/layout.svelte.d.ts +37 -0
- package/dist/plots/bar/layout.svelte.js +132 -0
- package/dist/plots/geo/Plot.svelte +577 -0
- package/dist/plots/geo/Plot.svelte.d.ts +29 -0
- package/dist/plots/geo/TileLayer.svelte +77 -0
- package/dist/plots/geo/TileLayer.svelte.d.ts +11 -0
- package/dist/plots/geo/projections/argentina.d.ts +8 -0
- package/dist/plots/geo/projections/argentina.js +35 -0
- package/dist/plots/geo/projections/fit.d.ts +8 -0
- package/dist/plots/geo/projections/fit.js +14 -0
- package/dist/plots/geo/rotate.svelte.d.ts +26 -0
- package/dist/plots/geo/rotate.svelte.js +79 -0
- package/dist/plots/geo/zoom.svelte.d.ts +32 -0
- package/dist/plots/geo/zoom.svelte.js +50 -0
- package/dist/plots/heatmap/Plot.svelte +171 -58
- package/dist/plots/heatmap/Plot.svelte.d.ts +7 -3
- package/dist/plots/line/Plot.svelte +67 -30
- package/dist/plots/line/Plot.svelte.d.ts +7 -3
- package/dist/plots/pyramid/Plot.svelte +88 -35
- package/dist/plots/pyramid/Plot.svelte.d.ts +7 -3
- package/dist/plots/utils/delta.d.ts +1 -1
- package/dist/plots/utils/geoAccessors.d.ts +64 -0
- package/dist/plots/utils/geoAccessors.js +188 -0
- package/dist/plots/utils/geoSegments.d.ts +14 -0
- package/dist/plots/utils/geoSegments.js +17 -0
- package/dist/plots/utils/legendDisabled.d.ts +15 -0
- package/dist/plots/utils/legendDisabled.js +41 -0
- package/dist/plots/utils/segments.d.ts +14 -5
- package/dist/plots/utils/segments.js +25 -13
- package/dist/plots/utils/tiles.d.ts +89 -0
- package/dist/plots/utils/tiles.js +159 -0
- package/dist/plots/utils/topojson.d.ts +9 -0
- package/dist/plots/utils/topojson.js +30 -0
- package/dist/types/charts/common.d.ts +2 -1
- package/dist/types/charts/legend.d.ts +32 -1
- package/dist/types/charts/props.d.ts +9 -6
- package/dist/types/configuration/styling.d.ts +13 -5
- package/dist/types/layout/legend.d.ts +26 -0
- package/dist/types/layout/tooltip.d.ts +14 -21
- package/dist/types/{plots/markers.d.ts → markers/common.d.ts} +2 -18
- package/dist/types/markers/geo.d.ts +237 -0
- package/dist/types/markers/props.d.ts +11 -0
- package/dist/types/markers/props.js +1 -0
- package/dist/types/plots/axis.d.ts +55 -0
- package/dist/types/plots/axis.js +1 -0
- package/dist/types/plots/constants.d.ts +30 -0
- package/dist/types/plots/constants.js +1 -0
- package/dist/types/plots/data/common.d.ts +40 -0
- package/dist/types/plots/data/common.js +1 -0
- package/dist/types/plots/data/geo.d.ts +74 -0
- package/dist/types/plots/data/geo.js +1 -0
- package/dist/types/plots/delta.d.ts +2 -2
- package/dist/types/plots/props.d.ts +105 -16
- package/dist/types/plots/scales/geo.d.ts +44 -0
- package/dist/types/plots/scales/geo.js +1 -0
- package/dist/types/plots/segments/common.d.ts +25 -0
- package/dist/types/plots/segments/common.js +1 -0
- package/dist/types/plots/segments/config.d.ts +51 -0
- package/dist/types/plots/segments/config.js +1 -0
- package/dist/types/plots/styles/common.d.ts +37 -0
- package/dist/types/plots/styles/common.js +1 -0
- package/dist/types/plots/styles/geo.d.ts +42 -0
- package/dist/types/plots/styles/geo.js +1 -0
- package/dist/types/plots/styling.d.ts +45 -0
- package/dist/types/plots/styling.js +1 -0
- package/dist/utils/grouping.d.ts +2 -1
- package/dist/utils/interpolate.d.ts +2 -1
- package/package.json +27 -13
- package/dist/layout/plot/PlotLayout.svelte +0 -294
- package/dist/layout/plot/PlotLayout.svelte.d.ts +0 -70
- package/dist/plots/markers/HoverMarker.svelte +0 -98
- package/dist/types/plots/common.d.ts +0 -97
- package/dist/types/plots/styles.d.ts +0 -187
- /package/dist/types/{plots/common.js → layout/legend.js} +0 -0
- /package/dist/types/{plots/markers.js → markers/common.js} +0 -0
- /package/dist/types/{plots/styles.js → markers/geo.js} +0 -0
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import type { AxisValue } from '../axis';
|
|
2
|
+
/**
|
|
3
|
+
* A field key or accessor function. Mirrors the shorthand used across plots
|
|
4
|
+
* so chart-level encodings (`x`, `y`, `z`, facet, timeline) feel consistent
|
|
5
|
+
* with the plot-level series definitions.
|
|
6
|
+
*/
|
|
7
|
+
export type Accessor<TRow extends Record<string, unknown>, V> = keyof TRow | ((d: TRow) => V);
|
|
8
|
+
/**
|
|
9
|
+
* A plot series: a name, x/y accessors and the rows it draws. Shared as-is by
|
|
10
|
+
* every mark (line, bar, …) — none of them need anything beyond this shape;
|
|
11
|
+
* visual styling lives separately in `segments`.
|
|
12
|
+
*/
|
|
13
|
+
export type Series<T extends Record<string, unknown> = Record<string, unknown>> = {
|
|
14
|
+
name: string;
|
|
15
|
+
x: Accessor<T, AxisValue>;
|
|
16
|
+
y: Accessor<T, AxisValue>;
|
|
17
|
+
z?: Accessor<T, unknown>;
|
|
18
|
+
data: T[];
|
|
19
|
+
};
|
|
20
|
+
/**
|
|
21
|
+
* Pre-built series. Mutually exclusive with {@link DataProps} — takes
|
|
22
|
+
* precedence when both could apply.
|
|
23
|
+
*/
|
|
24
|
+
export type SeriesProps<T extends Record<string, unknown>> = {
|
|
25
|
+
series: Series<T>[];
|
|
26
|
+
data?: never;
|
|
27
|
+
x?: never;
|
|
28
|
+
y?: never;
|
|
29
|
+
z?: never;
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* Flat rows to group into series, as an alternative to {@link SeriesProps}.
|
|
33
|
+
*/
|
|
34
|
+
export type DataProps<T extends Record<string, unknown>> = {
|
|
35
|
+
series?: never;
|
|
36
|
+
data: T[];
|
|
37
|
+
x: Accessor<T, AxisValue>;
|
|
38
|
+
y: Accessor<T, AxisValue>;
|
|
39
|
+
z?: Accessor<T, unknown>;
|
|
40
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
import type { Accessor } from './common';
|
|
2
|
+
/**
|
|
3
|
+
* One GeoJSON feature, generically typed over its `properties`. Intersected
|
|
4
|
+
* with `Record<string, unknown>` so it satisfies the same generic bound
|
|
5
|
+
* every other row type in this package does (e.g. `TooltipConfig<TRow
|
|
6
|
+
* extends Record<string, unknown>>`) — GeoJSON's own `Feature` type has no
|
|
7
|
+
* index signature on its own.
|
|
8
|
+
*/
|
|
9
|
+
export type GeoFeature<TProps extends Record<string, unknown> = Record<string, unknown>> = GeoJSON.Feature<GeoJSON.Geometry, TProps> & Record<string, unknown>;
|
|
10
|
+
export type GeoJsonInput<TProps extends Record<string, unknown>> = GeoJSON.FeatureCollection<GeoJSON.Geometry, TProps> | GeoFeature<TProps>[];
|
|
11
|
+
/**
|
|
12
|
+
* Minimal structural shape of a TopoJSON `Topology` object. Deliberately not
|
|
13
|
+
* imported from `topojson-client`'s own types, so referencing it never forces
|
|
14
|
+
* module resolution of that (optional peer) package at typecheck time for
|
|
15
|
+
* consumers who haven't installed it — see `$lib/plots/utils/topojson`.
|
|
16
|
+
*/
|
|
17
|
+
export type Topology = {
|
|
18
|
+
type: 'Topology';
|
|
19
|
+
objects: Record<string, unknown>;
|
|
20
|
+
arcs: unknown[][];
|
|
21
|
+
transform?: {
|
|
22
|
+
scale: [number, number];
|
|
23
|
+
translate: [number, number];
|
|
24
|
+
};
|
|
25
|
+
bbox?: number[];
|
|
26
|
+
};
|
|
27
|
+
/**
|
|
28
|
+
* Data contract for GeoPlot — the geo analog of {@link DataProps}/{@link SeriesProps}
|
|
29
|
+
* (`$lib/types/plots/data/common`). There's no x/y/z axis pair for geographic data:
|
|
30
|
+
* `data` IS the map.
|
|
31
|
+
*/
|
|
32
|
+
export type GeoDataProps<TProps extends Record<string, unknown> = Record<string, unknown>> = {
|
|
33
|
+
/**
|
|
34
|
+
* GeoJSON is always accepted. A TopoJSON `Topology` is also accepted, but
|
|
35
|
+
* only converted at runtime if `topojson-client` is installed (an optional
|
|
36
|
+
* peer dependency) — see `object`.
|
|
37
|
+
*/
|
|
38
|
+
data: GeoJsonInput<TProps> | Topology;
|
|
39
|
+
/**
|
|
40
|
+
* Required when `data` is a `Topology` — the key under `topology.objects`
|
|
41
|
+
* to convert via topojson-client's `feature()`. Ignored for GeoJSON input.
|
|
42
|
+
*/
|
|
43
|
+
object?: string;
|
|
44
|
+
/**
|
|
45
|
+
* Resolves each feature's stable id — used as the `segments` lookup key
|
|
46
|
+
* (e.g. `segments.argentina`) and for hover/click identification. Defaults
|
|
47
|
+
* to `feature.id ?? feature.properties?.id ?? feature.properties?.name`.
|
|
48
|
+
*/
|
|
49
|
+
featureId?: Accessor<GeoFeature<TProps>, string>;
|
|
50
|
+
/**
|
|
51
|
+
* Optional continuous value accessor for choropleth coloring (mirrors
|
|
52
|
+
* heatmap's `z`). A feature with no `value` (or when omitted entirely)
|
|
53
|
+
* falls back to `styles.fill`/`segments`.
|
|
54
|
+
*/
|
|
55
|
+
value?: (feature: GeoFeature<TProps>) => number | undefined;
|
|
56
|
+
/**
|
|
57
|
+
* Excludes matching parts of a feature's geometry from the map's own
|
|
58
|
+
* rendering and hover/click matching — e.g. so a separate `inset` marker
|
|
59
|
+
* (via its own `featurePartsFilter`) can take over showing that part
|
|
60
|
+
* elsewhere without it being drawn twice. Runs once per disjoint part of
|
|
61
|
+
* each feature's geometry (each polygon of a `MultiPolygon`, each line of
|
|
62
|
+
* a `MultiLineString`; any other geometry type is a single part). Return
|
|
63
|
+
* `true` to exclude that part — excluding every part of a feature drops
|
|
64
|
+
* it entirely, which also covers omitting a whole feature from the map.
|
|
65
|
+
* `segments` styling is unaffected (still keyed by whole-feature
|
|
66
|
+
* `featureId`, applied to whatever geometry remains).
|
|
67
|
+
*/
|
|
68
|
+
excludeParts?: (part: {
|
|
69
|
+
centroid: [number, number];
|
|
70
|
+
geometry: GeoJSON.Geometry;
|
|
71
|
+
}, feature: GeoFeature<TProps> & {
|
|
72
|
+
__id: string;
|
|
73
|
+
}) => boolean;
|
|
74
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { AxisValue } from './
|
|
2
|
-
import type { StrokeStyle, FontStyle, DotStyle } from './
|
|
1
|
+
import type { AxisValue } from './axis';
|
|
2
|
+
import type { StrokeStyle, FontStyle, DotStyle } from './styling';
|
|
3
3
|
export type DeltaTarget = {
|
|
4
4
|
type: 'series';
|
|
5
5
|
series: string;
|
|
@@ -1,23 +1,112 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import type {
|
|
3
|
-
import type {
|
|
4
|
-
import type {
|
|
1
|
+
import type { TooltipOptions } from '../layout/tooltip';
|
|
2
|
+
import type { Segment } from './segments/config';
|
|
3
|
+
import type { AxisScale } from './axis';
|
|
4
|
+
import type { GeoProjectionConfig } from './scales/geo';
|
|
5
|
+
/** The `styles` prop accepted by every plot kind — its own
|
|
6
|
+
* styles shape ({@link BasePlotStyles}, `GeoStyles`, …). */
|
|
7
|
+
export type StylesConfig<TStyles extends object> = TStyles;
|
|
8
|
+
/** The `markers` prop accepted by every plot kind — a list of that
|
|
9
|
+
* kind's own marker union ({@link Marker}, `GeoMarker`, …). */
|
|
10
|
+
export type MarkersConfig<TMarker> = TMarker[];
|
|
5
11
|
/**
|
|
6
|
-
*
|
|
7
|
-
* …). The `TSegmentStyle` parameter lets each plot narrow `segments` to its
|
|
8
|
-
* own style shape ({@link BarSegmentStyle}, {@link LineSegmentStyle}, etc.)
|
|
9
|
-
* while keeping everything else shared.
|
|
12
|
+
* The `segments` prop accepted by every plot kind.
|
|
10
13
|
*
|
|
11
|
-
*
|
|
12
|
-
*
|
|
14
|
+
* A record mapping series names (or `'default'` for all series) to lists of
|
|
15
|
+
* {@link Segment}s. Segments in a named key apply only to that series;
|
|
16
|
+
* segments under `'default'` apply to every series.
|
|
17
|
+
*
|
|
18
|
+
* ```ts
|
|
19
|
+
* segments: {
|
|
20
|
+
* female: [{ style: { stroke: { stroke: 'tomato' } } }], // catch-all for female
|
|
21
|
+
* male: [{ style: { stroke: { stroke: 'steelblue' } } }], // catch-all for male
|
|
22
|
+
* default: [{ areas: [{ x: { from: 2012, to: 2014 } }], style: { dots: { dotSymbol: 'circle' } } }],
|
|
23
|
+
* }
|
|
24
|
+
* ```
|
|
25
|
+
*
|
|
26
|
+
* Within each resolved series list, catch-alls (no `areas`) are evaluated last
|
|
27
|
+
* so that area-specific segments always override them, regardless of position.
|
|
28
|
+
* Area-specific segments also inherit any style key absent from their own style
|
|
29
|
+
* by merging the catch-all as a baseline — the area's own style wins on conflict.
|
|
30
|
+
* This lets you set a series colour once in a catch-all and add per-range dots
|
|
31
|
+
* or dash patterns without repeating the colour on every area segment.
|
|
32
|
+
*/
|
|
33
|
+
export type SegmentsConfig<TStyle> = Record<string, Segment<TStyle>[]>;
|
|
34
|
+
/**
|
|
35
|
+
* Partial margin override — only the sides you specify are overridden; the
|
|
36
|
+
* rest come from the theme (which itself defaults every side to `'auto'`).
|
|
37
|
+
* `'auto'` sizes that side to fit its rendered content (tick labels, axis
|
|
38
|
+
* title, rotated ticks); a number pins it exactly.
|
|
39
|
+
*/
|
|
40
|
+
export type MarginConfig = Partial<{
|
|
41
|
+
top: number | 'auto';
|
|
42
|
+
right: number | 'auto';
|
|
43
|
+
bottom: number | 'auto';
|
|
44
|
+
left: number | 'auto';
|
|
45
|
+
}>;
|
|
46
|
+
/**
|
|
47
|
+
* The `tooltip` prop a plot actually receives — the chart's resolved form of
|
|
48
|
+
* the author-facing {@link TooltipOptions} (which a chart accepts as a bare
|
|
49
|
+
* `boolean` or the full object via `TooltipProp`): `format`/`sync` become
|
|
50
|
+
* required once resolved, and `facetId` identifies the originating facet
|
|
51
|
+
* (`''` when not faceted). Presence of this object on a plot is what turns
|
|
52
|
+
* hovering on.
|
|
53
|
+
*/
|
|
54
|
+
export type TooltipConfig<TRow extends Record<string, unknown>> = Omit<TooltipOptions<TRow>, 'format' | 'sync'> & {
|
|
55
|
+
format: (row: TRow) => string;
|
|
56
|
+
sync: boolean;
|
|
57
|
+
facetId: string;
|
|
58
|
+
};
|
|
59
|
+
/**
|
|
60
|
+
* Per-axis scale overrides, passed as a single `scales` prop to every
|
|
61
|
+
* axis-based plot kind (`GeoPlot` uses {@link GeoScalesConfig} instead — a
|
|
62
|
+
* map has no x/y/z axis pair). `TData` threads through to
|
|
63
|
+
* {@link AxisScale.sort} on each axis.
|
|
64
|
+
*/
|
|
65
|
+
export type AxisBasedScalesConfig<TData = Record<string, unknown>> = {
|
|
66
|
+
x?: AxisScale<TData>;
|
|
67
|
+
y?: AxisScale<TData>;
|
|
68
|
+
z?: AxisScale<TData>;
|
|
69
|
+
};
|
|
70
|
+
/**
|
|
71
|
+
* `scales` prop for GeoPlot — the geo analog of {@link AxisBasedScalesConfig}.
|
|
72
|
+
* A map has no x/y/z axis pair, so this configures the projection and the
|
|
73
|
+
* choropleth colour domain instead.
|
|
74
|
+
*/
|
|
75
|
+
export type GeoScalesConfig = {
|
|
76
|
+
/** Which map projection to draw with. Defaults to `'equal-earth'`. */
|
|
77
|
+
projection?: GeoProjectionConfig;
|
|
78
|
+
/** Continuous choropleth value domain — mirrors heatmap's `scales.z.domain`. */
|
|
79
|
+
color?: {
|
|
80
|
+
domain?: [number, number];
|
|
81
|
+
};
|
|
82
|
+
};
|
|
83
|
+
/**
|
|
84
|
+
* The `scales` prop accepted by every plot kind — either flavor of scale
|
|
85
|
+
* config a plot kind can have ({@link AxisBasedScalesConfig} for the
|
|
86
|
+
* axis-based kinds, {@link GeoScalesConfig} for `GeoPlot`). Each concrete
|
|
87
|
+
* `Plot.svelte` narrows `BasePlotProps`'s `TScales` to exactly the one
|
|
88
|
+
* that applies to it, rather than accepting this whole union.
|
|
89
|
+
*/
|
|
90
|
+
export type ScalesConfig<TData = Record<string, unknown>> = AxisBasedScalesConfig<TData> | GeoScalesConfig;
|
|
91
|
+
/**
|
|
92
|
+
* The shared "prop bag" every plot component accepts, parameterized over
|
|
93
|
+
* everything that varies by plot kind: `TDataContract` is the kind's own
|
|
94
|
+
* data shape ({@link SeriesProps}`|`{@link DataProps} for the axis-based
|
|
95
|
+
* kinds, `GeoDataProps` for `GeoPlot`), `TRow` is what `tooltip` resolves
|
|
96
|
+
* against, and `TStyles`/`TSegmentStyle`/`TMarker`/`TScales` are that kind's
|
|
97
|
+
* own segment/style/marker/scale shapes. Each `Plot.svelte` instantiates
|
|
98
|
+
* this directly with its own concrete arguments rather than going through a
|
|
99
|
+
* shared per-kind alias — segments/styles/markers already diverge in shape
|
|
100
|
+
* across kinds today (or will soon), so a shared alias would just be an
|
|
101
|
+
* extra layer to keep in sync.
|
|
13
102
|
*/
|
|
14
|
-
export type
|
|
103
|
+
export type BasePlotProps<TDataContract, TRow extends Record<string, unknown>, TStyles extends object, TSegmentStyle extends object, TMarker, TScales extends ScalesConfig<TRow>> = TDataContract & {
|
|
15
104
|
width: number;
|
|
16
105
|
height: number;
|
|
17
|
-
styles?:
|
|
18
|
-
segments?:
|
|
19
|
-
markers?:
|
|
20
|
-
scales?:
|
|
106
|
+
styles?: StylesConfig<TStyles>;
|
|
107
|
+
segments?: SegmentsConfig<TSegmentStyle>;
|
|
108
|
+
markers?: MarkersConfig<TMarker>;
|
|
109
|
+
scales?: TScales;
|
|
21
110
|
margins?: MarginConfig;
|
|
22
|
-
tooltip?:
|
|
111
|
+
tooltip?: TooltipConfig<TRow>;
|
|
23
112
|
};
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The projection names svelteplot's `<Plot projection>` accepts as a string
|
|
3
|
+
* (svelteplot itself doesn't export this as a type — defined here so authors
|
|
4
|
+
* get autocomplete/type-checking over the full supported set).
|
|
5
|
+
*/
|
|
6
|
+
export type GeoProjectionName = 'albers-usa' | 'albers' | 'azimuthal-equal-area' | 'azimuthal-equidistant' | 'conic-conformal' | 'conic-equal-area' | 'conic-equidistant' | 'equal-earth' | 'equirectangular' | 'gnomonic' | 'identity' | 'reflect-y' | 'mercator' | 'orthographic' | 'stereographic' | 'transverse-mercator';
|
|
7
|
+
import type { GeoProjection } from 'd3-geo';
|
|
8
|
+
/**
|
|
9
|
+
* What a custom projection factory (e.g. `argentinaBicontinental` under
|
|
10
|
+
* `$lib`'s geo projections) must return — just enough of d3's `GeoProjection`
|
|
11
|
+
* for svelteplot to stream marks through it and invert pointer coordinates
|
|
12
|
+
* back to lon/lat. Deliberately narrower than importing `GeoProjection`
|
|
13
|
+
* itself, since a hand-tuned custom projection may not implement its full
|
|
14
|
+
* surface (e.g. no single `scale`/`translate` describing it).
|
|
15
|
+
*/
|
|
16
|
+
export type GeoCustomProjection = Pick<GeoProjection, 'stream'> & Partial<Pick<GeoProjection, 'invert'>>;
|
|
17
|
+
/**
|
|
18
|
+
* A custom projection factory, usable as `scales.projection.type` alongside
|
|
19
|
+
* (instead of) a `GeoProjectionName`. svelteplot calls this with the plot's
|
|
20
|
+
* inner width/height (already net of margins/insets) and expects a
|
|
21
|
+
* ready-to-use projection back.
|
|
22
|
+
*/
|
|
23
|
+
export type GeoCustomProjectionFactory = (opts: {
|
|
24
|
+
width: number;
|
|
25
|
+
height: number;
|
|
26
|
+
}) => GeoCustomProjection;
|
|
27
|
+
export type GeoProjectionConfig = GeoProjectionName | {
|
|
28
|
+
type?: GeoProjectionName | GeoCustomProjectionFactory;
|
|
29
|
+
rotate?: [number, number] | [number, number, number];
|
|
30
|
+
center?: [number, number] | [number, number, number];
|
|
31
|
+
parallels?: [number, number] | [number, number, number];
|
|
32
|
+
inset?: number;
|
|
33
|
+
clip?: boolean | null | number | 'frame';
|
|
34
|
+
/**
|
|
35
|
+
* Fits the projection's scale/translate to this GeoJSON object's extent
|
|
36
|
+
* instead of the projection's own default (whole-world-sized) framing,
|
|
37
|
+
* regardless of which named projection is active. Also what makes
|
|
38
|
+
* `'identity'`/`'reflect-y'` (which otherwise have no scale/translate of
|
|
39
|
+
* their own — they pass lon/lat through as-is) size themselves to fill
|
|
40
|
+
* the plot. Pass `'data'` to fit to whatever was already given to the
|
|
41
|
+
* plot's own `data` prop, instead of repeating it here.
|
|
42
|
+
*/
|
|
43
|
+
domain?: GeoJSON.GeoJsonObject | GeoJSON.FeatureCollection | GeoJSON.Feature | 'data';
|
|
44
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { StrokeStyle, DotStyle } from '../styling';
|
|
2
|
+
/** Per-segment styling for a line: its stroke and/or its endpoint dots. */
|
|
3
|
+
export type LineSegmentStyle = {
|
|
4
|
+
stroke?: StrokeStyle;
|
|
5
|
+
dots?: DotStyle;
|
|
6
|
+
};
|
|
7
|
+
/** Per-segment styling for a bar-shaped mark: its fill. Shared by `BarPlot` and `PyramidPlot`. */
|
|
8
|
+
export type BarSegmentStyle = {
|
|
9
|
+
fill?: string;
|
|
10
|
+
fillOpacity?: number;
|
|
11
|
+
};
|
|
12
|
+
/** Per-cell styling override for a heatmap cell. */
|
|
13
|
+
export type CellSegmentStyle = {
|
|
14
|
+
fill?: string;
|
|
15
|
+
fillOpacity?: number;
|
|
16
|
+
stroke?: string;
|
|
17
|
+
strokeWidth?: number;
|
|
18
|
+
};
|
|
19
|
+
/** Per-feature styling override for `GeoPlot` — the geo analog of `CellSegmentStyle`. */
|
|
20
|
+
export type GeoSegmentStyle = {
|
|
21
|
+
fill?: string;
|
|
22
|
+
fillOpacity?: number;
|
|
23
|
+
stroke?: string;
|
|
24
|
+
strokeWidth?: number;
|
|
25
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import type { AxisValue } from '../axis';
|
|
2
|
+
import type { Series } from '../data/common';
|
|
3
|
+
import type { LineSegmentStyle } from './common';
|
|
4
|
+
/** A half-open interval on one axis. Both bounds are inclusive; omit either to leave that end open. */
|
|
5
|
+
export type Range = {
|
|
6
|
+
from?: AxisValue;
|
|
7
|
+
to?: AxisValue;
|
|
8
|
+
};
|
|
9
|
+
/**
|
|
10
|
+
* A 2-D rectangular area on the plot, addressed by optional x and y intervals.
|
|
11
|
+
* Omitting an interval leaves that axis unrestricted (matches all values).
|
|
12
|
+
*
|
|
13
|
+
* - For line/bar/pyramid plots only the `x` interval is used (the series' primary
|
|
14
|
+
* axis); `y` is evaluated but filters by the series' value axis.
|
|
15
|
+
* - For heatmaps both `x` (column) and `y` (row) are used to address cells.
|
|
16
|
+
*/
|
|
17
|
+
export type Area = {
|
|
18
|
+
x?: Range;
|
|
19
|
+
y?: Range;
|
|
20
|
+
};
|
|
21
|
+
/**
|
|
22
|
+
* One styled rule for a plot. A data point (or cell) is styled when it falls
|
|
23
|
+
* inside **any** of the listed `areas`. Omitting `areas` (or passing an empty
|
|
24
|
+
* array) makes the segment a catch-all that matches every data point — useful
|
|
25
|
+
* as a baseline style. `TStyle` is the per-mark shape ({@link LineSegmentStyle},
|
|
26
|
+
* {@link BarSegmentStyle}, {@link CellSegmentStyle}, …).
|
|
27
|
+
*
|
|
28
|
+
* Catch-alls are evaluated last so that area-specific segments always take
|
|
29
|
+
* priority, regardless of their position in the list. A catch-all placed first
|
|
30
|
+
* therefore acts as a fallback baseline that area-specific segments override.
|
|
31
|
+
*/
|
|
32
|
+
export type Segment<TStyle> = {
|
|
33
|
+
areas?: Area[];
|
|
34
|
+
style?: TStyle;
|
|
35
|
+
};
|
|
36
|
+
/** One contiguous, styled slice of a series' data — ready to draw as its own mark. */
|
|
37
|
+
export type VisualSegment<T extends Record<string, unknown>, TStyle = LineSegmentStyle> = {
|
|
38
|
+
data: T[];
|
|
39
|
+
style: TStyle;
|
|
40
|
+
};
|
|
41
|
+
/**
|
|
42
|
+
* A series split into its styled visual segments. `S` is the full series
|
|
43
|
+
* type Series<T> — its row type is read off `S['data']`
|
|
44
|
+
* rather than taken as a separate parameter, since TypeScript can't reliably
|
|
45
|
+
* infer a type parameter that only appears inside another parameter's
|
|
46
|
+
* constraint.
|
|
47
|
+
*/
|
|
48
|
+
export type VisualGroup<S extends Series<any>, TStyle = LineSegmentStyle> = {
|
|
49
|
+
series: S;
|
|
50
|
+
visualSegments: VisualSegment<S['data'][number], TStyle>[];
|
|
51
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { ValueAnchor } from '../constants';
|
|
2
|
+
import type { FontStyle } from '../styling';
|
|
3
|
+
/**
|
|
4
|
+
* Controls if and how value labels are rendered on a plot. The high-level
|
|
5
|
+
* `anchor` sets sensible defaults for placement; the inherited {@link FontStyle}
|
|
6
|
+
* fields (`dx`, `dy`, `textAnchor`, `lineAnchor`, `lineHeight`, `rotate`,
|
|
7
|
+
* `class`, `textClass`, `fill`, …) override those defaults when provided.
|
|
8
|
+
*/
|
|
9
|
+
export type ValuesStyle = FontStyle & {
|
|
10
|
+
show?: boolean;
|
|
11
|
+
anchor?: ValueAnchor;
|
|
12
|
+
/** Called with the numeric value and the series name. Return a string to render. */
|
|
13
|
+
format?: (value: number, seriesName: string) => string;
|
|
14
|
+
};
|
|
15
|
+
/**
|
|
16
|
+
* Color overrides for plots that derive their palette from data.
|
|
17
|
+
* Each plot uses only the fields relevant to its kind; unused fields are
|
|
18
|
+
* silently ignored.
|
|
19
|
+
*
|
|
20
|
+
* - `min` / `max` — sequential colour ramp endpoints (heatmap).
|
|
21
|
+
* - `left` / `right` — diverging bar sides (pyramid).
|
|
22
|
+
*/
|
|
23
|
+
export type ColorsStyle = {
|
|
24
|
+
min?: string;
|
|
25
|
+
max?: string;
|
|
26
|
+
left?: string;
|
|
27
|
+
right?: string;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Top-level rendering style overrides shared by the non-geo plot kinds.
|
|
31
|
+
* Passed as the `styles` prop. Each plot reads only the fields it cares
|
|
32
|
+
* about.
|
|
33
|
+
*/
|
|
34
|
+
export type BasePlotStyles = {
|
|
35
|
+
values?: ValuesStyle;
|
|
36
|
+
colors?: ColorsStyle;
|
|
37
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import type { ColorsStyle } from './common';
|
|
2
|
+
import type { GeoFeature } from '../data/geo';
|
|
3
|
+
export type GeoTileLayerConfig = {
|
|
4
|
+
/** XYZ tile URL template, e.g. `'https://tile.openstreetmap.org/{z}/{x}/{y}.png'`. */
|
|
5
|
+
url: string;
|
|
6
|
+
attribution?: string;
|
|
7
|
+
opacity?: number;
|
|
8
|
+
minZoom?: number;
|
|
9
|
+
maxZoom?: number;
|
|
10
|
+
/** Tile edge length in pixels. Defaults to `256`. */
|
|
11
|
+
tileSize?: number;
|
|
12
|
+
};
|
|
13
|
+
export type GeoZoomConfig = {
|
|
14
|
+
min?: number;
|
|
15
|
+
max?: number;
|
|
16
|
+
initial?: {
|
|
17
|
+
x?: number;
|
|
18
|
+
y?: number;
|
|
19
|
+
k?: number;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
/**
|
|
23
|
+
* `styles` prop for GeoPlot — the geo analog of `BasePlotStyles`. Unlike the
|
|
24
|
+
* other plot kinds, GeoPlot's styling needs (base map, choropleth ramp, tile
|
|
25
|
+
* background, zoom, click handling) are unlike anything x/y plots need, so
|
|
26
|
+
* this is its own type rather than a reuse of `BasePlotStyles`.
|
|
27
|
+
*/
|
|
28
|
+
export type GeoStyles<TProps extends Record<string, unknown> = Record<string, unknown>> = {
|
|
29
|
+
/** Base map fill, used when a feature isn't styled by `segments` or the choropleth ramp. */
|
|
30
|
+
fill?: string;
|
|
31
|
+
fillOpacity?: number;
|
|
32
|
+
stroke?: string;
|
|
33
|
+
strokeWidth?: number;
|
|
34
|
+
/** Continuous choropleth ramp endpoints — used when `value` is provided on data. Mirrors heatmap's `styles.colors`. */
|
|
35
|
+
colors?: ColorsStyle;
|
|
36
|
+
/** Raster XYZ tile basemap under the vector geometry. Mercator-family projections only. */
|
|
37
|
+
tileLayer?: GeoTileLayerConfig;
|
|
38
|
+
/** `true`/config enables drag-pan + scroll-zoom. Omitted/`false` = static map. */
|
|
39
|
+
zoom?: boolean | GeoZoomConfig;
|
|
40
|
+
/** Fired when a base-map feature is clicked. */
|
|
41
|
+
onFeatureClick?: (feature: GeoFeature<TProps>, event: Event) => void;
|
|
42
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import type { FontWeight, FontStyleKeyword, TextAnchor, LineAnchor, LineStyle, LineCap, LineJoin, SymbolType } from './constants';
|
|
2
|
+
/** Text/label styling for any text mark — a marker's label, an annotation, a value label. */
|
|
3
|
+
export type FontStyle = {
|
|
4
|
+
fill?: string;
|
|
5
|
+
fontSize?: number;
|
|
6
|
+
fontWeight?: FontWeight;
|
|
7
|
+
fontStyle?: FontStyleKeyword;
|
|
8
|
+
textAnchor?: TextAnchor;
|
|
9
|
+
lineAnchor?: LineAnchor;
|
|
10
|
+
lineHeight?: number;
|
|
11
|
+
rotate?: number;
|
|
12
|
+
stroke?: string;
|
|
13
|
+
strokeWidth?: number;
|
|
14
|
+
paintOrder?: string;
|
|
15
|
+
dx?: number;
|
|
16
|
+
dy?: number;
|
|
17
|
+
class?: string;
|
|
18
|
+
textClass?: string;
|
|
19
|
+
};
|
|
20
|
+
/** Stroke styling for any line-ish mark — a line, a rule, a marker's connector. */
|
|
21
|
+
export type StrokeStyle = {
|
|
22
|
+
stroke?: string;
|
|
23
|
+
strokeWidth?: number;
|
|
24
|
+
strokeOpacity?: number;
|
|
25
|
+
strokeDasharray?: string | LineStyle;
|
|
26
|
+
strokeLinecap?: LineCap;
|
|
27
|
+
strokeLinejoin?: LineJoin;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Dot styling for any point mark — a line's endpoint dots, a marker's dot.
|
|
31
|
+
* Carries its own `dotStroke*` fields rather than nesting a {@link StrokeStyle},
|
|
32
|
+
* because a dot's outline is a distinct style from the stroke of the line (or
|
|
33
|
+
* other mark) it sits next to — e.g. a `LineSegmentStyle` styles its
|
|
34
|
+
* line's stroke and its dots' outline independently.
|
|
35
|
+
*/
|
|
36
|
+
export type DotStyle = {
|
|
37
|
+
dotRadius?: number;
|
|
38
|
+
dotFill?: string;
|
|
39
|
+
dotFillOpacity?: number;
|
|
40
|
+
dotSymbol?: SymbolType;
|
|
41
|
+
dotStroke?: string;
|
|
42
|
+
dotStrokeWidth?: number;
|
|
43
|
+
dotStrokeOpacity?: number;
|
|
44
|
+
dotStrokeDasharray?: string | LineStyle;
|
|
45
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/utils/grouping.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { AxisValue } from '../types/plots/axis';
|
|
2
|
+
import type { Series, Accessor } from '../types/plots/data/common';
|
|
2
3
|
/**
|
|
3
4
|
* Splits rows into ordered groups keyed by the stringified accessor value.
|
|
4
5
|
* Insertion order of first appearance is preserved, which keeps colours stable
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { EasingName, EasingFn } from '../types/charts/interpolate';
|
|
2
2
|
import type { TimeValue, TimelineInterpolation } from '../types/charts/common';
|
|
3
|
-
import type {
|
|
3
|
+
import type { AxisValue } from '../types/plots/axis';
|
|
4
|
+
import type { Accessor } from '../types/plots/data/common';
|
|
4
5
|
export declare function resolveEasing(easing?: EasingName | EasingFn): EasingFn;
|
|
5
6
|
/**
|
|
6
7
|
* Brackets a continuous target position `x` within one key-group's sorted
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fundar/data-chart-telling",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.16",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist"
|
|
@@ -18,46 +18,60 @@
|
|
|
18
18
|
}
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"
|
|
21
|
+
"@types/geojson": "^7946.0.16",
|
|
22
|
+
"d3-geo": "^3.1.1",
|
|
23
|
+
"d3-interpolate": "^3.0.1",
|
|
24
|
+
"d3-selection": "^3.0.0",
|
|
25
|
+
"d3-zoom": "^3.0.0"
|
|
22
26
|
},
|
|
23
27
|
"peerDependencies": {
|
|
24
28
|
"svelte": "^5.0.0",
|
|
25
|
-
"svelteplot": "^0.14.0"
|
|
29
|
+
"svelteplot": "^0.14.0",
|
|
30
|
+
"topojson-client": "^3.1.0"
|
|
31
|
+
},
|
|
32
|
+
"peerDependenciesMeta": {
|
|
33
|
+
"topojson-client": {
|
|
34
|
+
"optional": true
|
|
35
|
+
}
|
|
26
36
|
},
|
|
27
37
|
"devDependencies": {
|
|
38
|
+
"@chromatic-com/storybook": "^5.2.1",
|
|
28
39
|
"@eslint/compat": "^2.0.4",
|
|
29
40
|
"@eslint/js": "^10.0.1",
|
|
41
|
+
"@storybook/addon-a11y": "^10.4.1",
|
|
42
|
+
"@storybook/addon-docs": "^10.4.1",
|
|
43
|
+
"@storybook/addon-svelte-csf": "^5.1.2",
|
|
44
|
+
"@storybook/addon-vitest": "^10.4.1",
|
|
45
|
+
"@storybook/svelte-vite": "^10.4.1",
|
|
30
46
|
"@sveltejs/package": "^2.5.7",
|
|
31
47
|
"@sveltejs/vite-plugin-svelte": "^7.0.0",
|
|
48
|
+
"@types/d3-geo": "^3.1.0",
|
|
32
49
|
"@types/d3-interpolate": "^3.0.4",
|
|
50
|
+
"@types/d3-selection": "^3.0.11",
|
|
51
|
+
"@types/d3-zoom": "^3.0.8",
|
|
33
52
|
"@types/node": "^22",
|
|
34
53
|
"@vitest/browser": "^4.1.7",
|
|
35
54
|
"@vitest/browser-playwright": "^4.1.7",
|
|
55
|
+
"@vitest/coverage-v8": "4.1.7",
|
|
36
56
|
"eslint": "^10.2.0",
|
|
37
57
|
"eslint-config-prettier": "^10.1.8",
|
|
58
|
+
"eslint-plugin-storybook": "^10.4.1",
|
|
38
59
|
"eslint-plugin-svelte": "^3.17.0",
|
|
39
60
|
"globals": "^17.4.0",
|
|
40
61
|
"playwright": "^1.60.0",
|
|
41
62
|
"prettier": "^3.8.1",
|
|
42
63
|
"prettier-plugin-svelte": "^3.5.1",
|
|
43
64
|
"publint": "^0.3.18",
|
|
65
|
+
"storybook": "^10.4.1",
|
|
44
66
|
"svelte": "^5.55.2",
|
|
45
67
|
"svelte-check": "^4.4.6",
|
|
46
68
|
"svelteplot": "^0.14.0",
|
|
69
|
+
"topojson-client": "^3.1.0",
|
|
47
70
|
"typescript": "^6.0.2",
|
|
48
71
|
"typescript-eslint": "^8.58.1",
|
|
49
72
|
"vite": "^8.0.7",
|
|
50
73
|
"vitest": "^4.1.3",
|
|
51
|
-
"vitest-browser-svelte": "^2.1.1"
|
|
52
|
-
"storybook": "^10.4.1",
|
|
53
|
-
"@storybook/svelte-vite": "^10.4.1",
|
|
54
|
-
"@storybook/addon-svelte-csf": "^5.1.2",
|
|
55
|
-
"@chromatic-com/storybook": "^5.2.1",
|
|
56
|
-
"@storybook/addon-vitest": "^10.4.1",
|
|
57
|
-
"@storybook/addon-a11y": "^10.4.1",
|
|
58
|
-
"@storybook/addon-docs": "^10.4.1",
|
|
59
|
-
"eslint-plugin-storybook": "^10.4.1",
|
|
60
|
-
"@vitest/coverage-v8": "4.1.7"
|
|
74
|
+
"vitest-browser-svelte": "^2.1.1"
|
|
61
75
|
},
|
|
62
76
|
"keywords": [
|
|
63
77
|
"svelte"
|