svelteplot 0.2.6-next.5 → 0.2.6-pr-67.0
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/Mark.svelte +1 -1
- package/dist/Plot.svelte +1 -1
- package/dist/core/FacetGrid.svelte +2 -2
- package/dist/core/Plot.svelte +1 -0
- package/dist/helpers/colors.d.ts +1 -1
- package/dist/helpers/index.d.ts +2 -2
- package/dist/helpers/resolve.js +7 -4
- package/dist/helpers/scales.d.ts +1 -1
- package/dist/helpers/scales.js +2 -1
- package/dist/helpers/time.d.ts +4 -3
- package/dist/helpers/time.js +1 -1
- package/dist/helpers/typeChecks.d.ts +4 -4
- package/dist/marks/Area.svelte +17 -23
- package/dist/marks/Area.svelte.d.ts +9 -17
- package/dist/marks/AreaX.svelte +7 -6
- package/dist/marks/AreaX.svelte.d.ts +7 -6
- package/dist/marks/AreaY.svelte +7 -15
- package/dist/marks/AreaY.svelte.d.ts +7 -10
- package/dist/marks/Arrow.svelte +25 -25
- package/dist/marks/Arrow.svelte.d.ts +5 -8
- package/dist/marks/AxisX.svelte +50 -44
- package/dist/marks/AxisX.svelte.d.ts +4 -3
- package/dist/marks/AxisY.svelte +39 -31
- package/dist/marks/AxisY.svelte.d.ts +7 -4
- package/dist/marks/BarX.svelte +27 -12
- package/dist/marks/BarX.svelte.d.ts +17 -1
- package/dist/marks/BarY.svelte +21 -11
- package/dist/marks/BarY.svelte.d.ts +4 -4
- package/dist/marks/BollingerX.svelte +15 -7
- package/dist/marks/BollingerX.svelte.d.ts +3 -3
- package/dist/marks/BollingerY.svelte +9 -7
- package/dist/marks/BollingerY.svelte.d.ts +3 -3
- package/dist/marks/BoxX.svelte +3 -0
- package/dist/marks/BoxX.svelte.d.ts +1 -0
- package/dist/marks/BoxY.svelte +3 -0
- package/dist/marks/BoxY.svelte.d.ts +1 -0
- package/dist/marks/BrushX.svelte +5 -1
- package/dist/marks/BrushX.svelte.d.ts +2 -1
- package/dist/marks/BrushY.svelte +5 -1
- package/dist/marks/BrushY.svelte.d.ts +2 -1
- package/dist/marks/Cell.svelte +18 -21
- package/dist/marks/Cell.svelte.d.ts +3 -9
- package/dist/marks/CellX.svelte +7 -12
- package/dist/marks/CellX.svelte.d.ts +3 -1
- package/dist/marks/CellY.svelte +7 -12
- package/dist/marks/CellY.svelte.d.ts +3 -1
- package/dist/marks/ColorLegend.svelte +10 -8
- package/dist/marks/ColorLegend.svelte.d.ts +3 -5
- package/dist/marks/CustomMark.svelte +1 -1
- package/dist/marks/CustomMarkHTML.svelte +1 -1
- package/dist/marks/DifferenceY.svelte +22 -20
- package/dist/marks/DifferenceY.svelte.d.ts +5 -5
- package/dist/marks/Dot.svelte +17 -27
- package/dist/marks/Dot.svelte.d.ts +5 -15
- package/dist/marks/DotX.svelte +10 -9
- package/dist/marks/DotX.svelte.d.ts +4 -7
- package/dist/marks/DotY.svelte +9 -2
- package/dist/marks/DotY.svelte.d.ts +4 -3
- package/dist/marks/Frame.svelte +42 -31
- package/dist/marks/Frame.svelte.d.ts +8 -3
- package/dist/marks/Geo.svelte +18 -11
- package/dist/marks/Geo.svelte.d.ts +4 -3
- package/dist/marks/Graticule.svelte +15 -8
- package/dist/marks/Graticule.svelte.d.ts +2 -1
- package/dist/marks/GridX.svelte +11 -6
- package/dist/marks/GridX.svelte.d.ts +3 -2
- package/dist/marks/GridY.svelte +11 -3
- package/dist/marks/GridY.svelte.d.ts +3 -2
- package/dist/marks/HTMLTooltip.svelte +2 -1
- package/dist/marks/HTMLTooltip.svelte.d.ts +4 -0
- package/dist/marks/Line.svelte +9 -19
- package/dist/marks/Line.svelte.d.ts +6 -11
- package/dist/marks/LineX.svelte +5 -2
- package/dist/marks/LineX.svelte.d.ts +3 -2
- package/dist/marks/LineY.svelte +5 -2
- package/dist/marks/LineY.svelte.d.ts +3 -2
- package/dist/marks/Link.svelte +20 -19
- package/dist/marks/Link.svelte.d.ts +6 -6
- package/dist/marks/Rect.svelte +15 -12
- package/dist/marks/Rect.svelte.d.ts +3 -3
- package/dist/marks/RectX.svelte +10 -20
- package/dist/marks/RectX.svelte.d.ts +6 -12
- package/dist/marks/RectY.svelte +10 -20
- package/dist/marks/RectY.svelte.d.ts +6 -12
- package/dist/marks/RegressionX.svelte +10 -2
- package/dist/marks/RegressionX.svelte.d.ts +2 -0
- package/dist/marks/RegressionY.svelte +9 -2
- package/dist/marks/RegressionY.svelte.d.ts +2 -0
- package/dist/marks/RuleX.svelte +16 -13
- package/dist/marks/RuleX.svelte.d.ts +3 -4
- package/dist/marks/RuleY.svelte +16 -13
- package/dist/marks/RuleY.svelte.d.ts +3 -4
- package/dist/marks/Sphere.svelte +9 -2
- package/dist/marks/Sphere.svelte.d.ts +4 -59
- package/dist/marks/Spike.svelte +9 -1
- package/dist/marks/Spike.svelte.d.ts +2 -0
- package/dist/marks/SymbolLegend.svelte +1 -1
- package/dist/marks/Text.svelte +34 -35
- package/dist/marks/Text.svelte.d.ts +4 -7
- package/dist/marks/TickX.svelte +25 -20
- package/dist/marks/TickX.svelte.d.ts +3 -3
- package/dist/marks/TickY.svelte +25 -20
- package/dist/marks/TickY.svelte.d.ts +3 -3
- package/dist/marks/Vector.svelte +5 -5
- package/dist/marks/Vector.svelte.d.ts +2 -5
- package/dist/marks/helpers/BaseAxisX.svelte +1 -1
- package/dist/marks/helpers/LinearGradientX.svelte +1 -1
- package/dist/marks/helpers/LinearGradientY.svelte +1 -1
- package/dist/marks/helpers/MarkerPath.svelte +1 -1
- package/dist/marks/helpers/MarkerPath.svelte.d.ts +1 -41
- package/dist/marks/helpers/RectPath.svelte +17 -13
- package/dist/marks/helpers/RectPath.svelte.d.ts +1 -0
- package/dist/marks/helpers/events.js +3 -6
- package/dist/transforms/bollinger.d.ts +1 -8
- package/dist/transforms/centroid.d.ts +1 -8
- package/dist/transforms/group.d.ts +4 -12
- package/dist/transforms/index.d.ts +1 -0
- package/dist/transforms/index.js +1 -0
- package/dist/transforms/interval.d.ts +2 -6
- package/dist/transforms/jitter.d.ts +17 -0
- package/dist/transforms/jitter.js +60 -1
- package/dist/transforms/map.d.ts +4 -10
- package/dist/transforms/normalize.d.ts +2 -6
- package/dist/transforms/recordize.js +4 -4
- package/dist/transforms/select.d.ts +7 -21
- package/dist/transforms/sort.d.ts +3 -16
- package/dist/transforms/window.d.ts +2 -14
- package/dist/types.d.ts +13 -11
- package/dist/ui/RadioInput.svelte +1 -1
- package/dist/ui/Select.svelte +1 -1
- package/package.json +9 -9
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
type AxisXProps = BaseMarkProps & {
|
|
1
|
+
export type AxisXMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity' | 'paintOrder' | 'title' | 'href' | 'target'> & {
|
|
3
2
|
data?: RawValue[];
|
|
4
3
|
automatic?: boolean;
|
|
5
4
|
title?: string;
|
|
@@ -13,6 +12,8 @@ type AxisXProps = BaseMarkProps & {
|
|
|
13
12
|
tickFormat?: 'auto' | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((d: RawValue) => string);
|
|
14
13
|
tickClass?: ConstantAccessor<string>;
|
|
15
14
|
};
|
|
16
|
-
|
|
15
|
+
import type { BaseMarkProps, RawValue, ConstantAccessor } from '../types.js';
|
|
16
|
+
/** Renders a horizontal axis with labels and tick marks */
|
|
17
|
+
declare const AxisX: import("svelte").Component<AxisXMarkProps, {}, "">;
|
|
17
18
|
type AxisX = ReturnType<typeof AxisX>;
|
|
18
19
|
export default AxisX;
|
package/dist/marks/AxisY.svelte
CHANGED
|
@@ -1,3 +1,31 @@
|
|
|
1
|
+
<!-- @component
|
|
2
|
+
Renders a vertical axis with labels and tick marks
|
|
3
|
+
-->
|
|
4
|
+
<script module lang="ts">
|
|
5
|
+
export type AxisYMarkProps = Omit<
|
|
6
|
+
BaseMarkProps,
|
|
7
|
+
'fill' | 'fillOpacity' | 'paintOrder' | 'title' | 'href' | 'target'
|
|
8
|
+
> & {
|
|
9
|
+
data?: RawValue[];
|
|
10
|
+
automatic?: boolean;
|
|
11
|
+
title?: string;
|
|
12
|
+
anchor?: 'left' | 'right';
|
|
13
|
+
facetAnchor?: 'auto' | 'left' | 'right' | 'left-empty' | 'right-empty';
|
|
14
|
+
lineAnchor?: 'top' | 'center' | 'bottom';
|
|
15
|
+
interval?: string | number;
|
|
16
|
+
labelAnchor?: 'auto' | 'left' | 'center' | 'right';
|
|
17
|
+
tickSize?: number;
|
|
18
|
+
tickFontSize?: ConstantAccessor<number>;
|
|
19
|
+
tickPadding?: number;
|
|
20
|
+
tickFormat?:
|
|
21
|
+
| 'auto'
|
|
22
|
+
| Intl.DateTimeFormatOptions
|
|
23
|
+
| Intl.NumberFormatOptions
|
|
24
|
+
| ((d: RawValue) => string);
|
|
25
|
+
tickClass?: ConstantAccessor<string>;
|
|
26
|
+
};
|
|
27
|
+
</script>
|
|
28
|
+
|
|
1
29
|
<script lang="ts">
|
|
2
30
|
import { getContext } from 'svelte';
|
|
3
31
|
import BaseAxisY from './helpers/BaseAxisY.svelte';
|
|
@@ -22,29 +50,11 @@
|
|
|
22
50
|
...getContext<Partial<DefaultOptions>>('svelteplot/_defaults')
|
|
23
51
|
};
|
|
24
52
|
|
|
25
|
-
type AxisYProps = BaseMarkProps & {
|
|
26
|
-
data?: RawValue[];
|
|
27
|
-
automatic?: boolean;
|
|
28
|
-
title?: string;
|
|
29
|
-
anchor?: 'left' | 'right';
|
|
30
|
-
facetAnchor?: 'auto' | 'left' | 'right' | 'left-empty' | 'right-empty';
|
|
31
|
-
lineAnchor?: 'top' | 'center' | 'bottom';
|
|
32
|
-
tickSize?: number;
|
|
33
|
-
tickFontSize?: ConstantAccessor<number>;
|
|
34
|
-
tickPadding?: number;
|
|
35
|
-
tickFormat?:
|
|
36
|
-
| 'auto'
|
|
37
|
-
| Intl.DateTimeFormatOptions
|
|
38
|
-
| Intl.NumberFormatOptions
|
|
39
|
-
| ((d: RawValue) => string);
|
|
40
|
-
tickClass?: ConstantAccessor<string>;
|
|
41
|
-
};
|
|
42
|
-
|
|
43
53
|
let {
|
|
44
54
|
data = [],
|
|
45
55
|
automatic = false,
|
|
46
56
|
title,
|
|
47
|
-
anchor = DEFAULTS.axisYAnchor,
|
|
57
|
+
anchor = DEFAULTS.axisYAnchor as 'left' | 'right',
|
|
48
58
|
facetAnchor = 'auto',
|
|
49
59
|
lineAnchor = 'center',
|
|
50
60
|
tickSize = DEFAULTS.tickSize,
|
|
@@ -53,7 +63,7 @@
|
|
|
53
63
|
tickFormat,
|
|
54
64
|
tickClass,
|
|
55
65
|
...options
|
|
56
|
-
}:
|
|
66
|
+
}: AxisYMarkProps = $props();
|
|
57
67
|
|
|
58
68
|
const { getPlotState } = getContext<PlotContext>('svelteplot');
|
|
59
69
|
const plot = $derived(getPlotState());
|
|
@@ -120,17 +130,15 @@
|
|
|
120
130
|
facetAnchor !== 'auto' ? facetAnchor : anchor === 'left' ? 'left-empty' : 'right-empty'
|
|
121
131
|
);
|
|
122
132
|
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
useFacetAnchor === '
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
: rightEmpty;
|
|
133
|
-
});
|
|
133
|
+
const showAxis = $state(
|
|
134
|
+
useFacetAnchor === 'left'
|
|
135
|
+
? left
|
|
136
|
+
: useFacetAnchor === 'right'
|
|
137
|
+
? right
|
|
138
|
+
: useFacetAnchor === 'left-empty'
|
|
139
|
+
? leftEmpty
|
|
140
|
+
: rightEmpty
|
|
141
|
+
);
|
|
134
142
|
</script>
|
|
135
143
|
|
|
136
144
|
<Mark
|
|
@@ -1,18 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
import type { ConstantAccessor } from '../types.js';
|
|
3
|
-
type AxisYProps = BaseMarkProps & {
|
|
1
|
+
export type AxisYMarkProps = Omit<BaseMarkProps, 'fill' | 'fillOpacity' | 'paintOrder' | 'title' | 'href' | 'target'> & {
|
|
4
2
|
data?: RawValue[];
|
|
5
3
|
automatic?: boolean;
|
|
6
4
|
title?: string;
|
|
7
5
|
anchor?: 'left' | 'right';
|
|
8
6
|
facetAnchor?: 'auto' | 'left' | 'right' | 'left-empty' | 'right-empty';
|
|
9
7
|
lineAnchor?: 'top' | 'center' | 'bottom';
|
|
8
|
+
interval?: string | number;
|
|
9
|
+
labelAnchor?: 'auto' | 'left' | 'center' | 'right';
|
|
10
10
|
tickSize?: number;
|
|
11
11
|
tickFontSize?: ConstantAccessor<number>;
|
|
12
12
|
tickPadding?: number;
|
|
13
13
|
tickFormat?: 'auto' | Intl.DateTimeFormatOptions | Intl.NumberFormatOptions | ((d: RawValue) => string);
|
|
14
14
|
tickClass?: ConstantAccessor<string>;
|
|
15
15
|
};
|
|
16
|
-
|
|
16
|
+
import type { BaseMarkProps, RawValue } from '../types.js';
|
|
17
|
+
import type { ConstantAccessor } from '../types.js';
|
|
18
|
+
/** Renders a vertical axis with labels and tick marks */
|
|
19
|
+
declare const AxisY: import("svelte").Component<AxisYMarkProps, {}, "">;
|
|
17
20
|
type AxisY = ReturnType<typeof AxisY>;
|
|
18
21
|
export default AxisY;
|
package/dist/marks/BarX.svelte
CHANGED
|
@@ -2,26 +2,41 @@
|
|
|
2
2
|
@component
|
|
3
3
|
For horizontal bar charts using a band scale as y axis
|
|
4
4
|
-->
|
|
5
|
+
<script module lang="ts">
|
|
6
|
+
import type {
|
|
7
|
+
PlotContext,
|
|
8
|
+
BaseMarkProps,
|
|
9
|
+
BaseRectMarkProps,
|
|
10
|
+
ChannelAccessor
|
|
11
|
+
} from '../types.js';
|
|
12
|
+
|
|
13
|
+
export type BarXMarkProps = BaseMarkProps &
|
|
14
|
+
BaseRectMarkProps & {
|
|
15
|
+
data: DataRow[];
|
|
16
|
+
x?: ChannelAccessor;
|
|
17
|
+
x1?: ChannelAccessor;
|
|
18
|
+
x2?: ChannelAccessor;
|
|
19
|
+
y?: ChannelAccessor;
|
|
20
|
+
stack?: StackOptions;
|
|
21
|
+
/**
|
|
22
|
+
* Converts x into x1/x2 ranges based on the provided interval. Disables the
|
|
23
|
+
* implicit stacking
|
|
24
|
+
*/
|
|
25
|
+
interval?: number | string;
|
|
26
|
+
};
|
|
27
|
+
</script>
|
|
28
|
+
|
|
5
29
|
<script lang="ts">
|
|
6
30
|
import Mark from '../Mark.svelte';
|
|
7
31
|
import { getContext } from 'svelte';
|
|
8
32
|
import { stackX, recordizeX, intervalX, sort } from '../index.js';
|
|
9
|
-
|
|
33
|
+
|
|
10
34
|
import type { StackOptions } from '../transforms/stack.js';
|
|
11
35
|
import type { DataRow } from '../types.js';
|
|
12
36
|
import GroupMultiple from './helpers/GroupMultiple.svelte';
|
|
13
37
|
import RectPath from './helpers/RectPath.svelte';
|
|
14
38
|
|
|
15
|
-
|
|
16
|
-
data: DataRow[];
|
|
17
|
-
x?: ChannelAccessor;
|
|
18
|
-
x1?: ChannelAccessor;
|
|
19
|
-
x2?: ChannelAccessor;
|
|
20
|
-
y?: ChannelAccessor;
|
|
21
|
-
stack?: StackOptions;
|
|
22
|
-
} & RectMarkProps;
|
|
23
|
-
|
|
24
|
-
let { data = [{}], class: className = null, stack, ...options }: BarXProps = $props();
|
|
39
|
+
let { data = [{}], class: className = null, stack, ...options }: BarXMarkProps = $props();
|
|
25
40
|
|
|
26
41
|
const { getPlotState } = getContext<PlotContext>('svelteplot');
|
|
27
42
|
const plot = $derived(getPlotState());
|
|
@@ -45,7 +60,7 @@
|
|
|
45
60
|
{...args}>
|
|
46
61
|
{#snippet children({ mark, usedScales, scaledData })}
|
|
47
62
|
<GroupMultiple class="bar-x" length={scaledData.length}>
|
|
48
|
-
{#each scaledData as d}
|
|
63
|
+
{#each scaledData as d, i (i)}
|
|
49
64
|
{@const bw = plot.scales.y.fn.bandwidth()}
|
|
50
65
|
{@const minx = Math.min(d.x1, d.x2)}
|
|
51
66
|
{@const maxx = Math.max(d.x1, d.x2)}
|
|
@@ -1,4 +1,20 @@
|
|
|
1
|
+
import type { BaseMarkProps, BaseRectMarkProps, ChannelAccessor } from '../types.js';
|
|
2
|
+
export type BarXMarkProps = BaseMarkProps & BaseRectMarkProps & {
|
|
3
|
+
data: DataRow[];
|
|
4
|
+
x?: ChannelAccessor;
|
|
5
|
+
x1?: ChannelAccessor;
|
|
6
|
+
x2?: ChannelAccessor;
|
|
7
|
+
y?: ChannelAccessor;
|
|
8
|
+
stack?: StackOptions;
|
|
9
|
+
/**
|
|
10
|
+
* Converts x into x1/x2 ranges based on the provided interval. Disables the
|
|
11
|
+
* implicit stacking
|
|
12
|
+
*/
|
|
13
|
+
interval?: number | string;
|
|
14
|
+
};
|
|
15
|
+
import type { StackOptions } from '../transforms/stack.js';
|
|
16
|
+
import type { DataRow } from '../types.js';
|
|
1
17
|
/** For horizontal bar charts using a band scale as y axis */
|
|
2
|
-
declare const BarX: import("svelte").Component<
|
|
18
|
+
declare const BarX: import("svelte").Component<BarXMarkProps, {}, "">;
|
|
3
19
|
type BarX = ReturnType<typeof BarX>;
|
|
4
20
|
export default BarX;
|
package/dist/marks/BarY.svelte
CHANGED
|
@@ -2,16 +2,16 @@
|
|
|
2
2
|
@component
|
|
3
3
|
For vertical column charts using a band scale as x axis
|
|
4
4
|
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
5
|
+
<script module lang="ts">
|
|
6
|
+
import type {
|
|
7
|
+
PlotContext,
|
|
8
|
+
BaseMarkProps,
|
|
9
|
+
BaseRectMarkProps,
|
|
10
|
+
ChannelAccessor,
|
|
11
|
+
DataRow
|
|
12
|
+
} from '../types.js';
|
|
13
13
|
|
|
14
|
-
type
|
|
14
|
+
export type BarYMarkProps = BaseMarkProps &
|
|
15
15
|
BaseRectMarkProps & {
|
|
16
16
|
data: DataRow[];
|
|
17
17
|
x?: ChannelAccessor;
|
|
@@ -25,8 +25,18 @@
|
|
|
25
25
|
*/
|
|
26
26
|
interval?: number | string;
|
|
27
27
|
};
|
|
28
|
+
</script>
|
|
29
|
+
|
|
30
|
+
<script lang="ts">
|
|
31
|
+
import Mark from '../Mark.svelte';
|
|
32
|
+
import { getContext } from 'svelte';
|
|
33
|
+
import { intervalY, stackY, recordizeY, sort } from '../index.js';
|
|
34
|
+
|
|
35
|
+
import type { StackOptions } from '../transforms/stack.js';
|
|
36
|
+
import GroupMultiple from './helpers/GroupMultiple.svelte';
|
|
37
|
+
import RectPath from './helpers/RectPath.svelte';
|
|
28
38
|
|
|
29
|
-
let { data = [{}], class: className = null, stack, ...options }:
|
|
39
|
+
let { data = [{}], class: className = null, stack, ...options }: BarYMarkProps = $props();
|
|
30
40
|
|
|
31
41
|
const { getPlotState } = getContext<PlotContext>('svelteplot');
|
|
32
42
|
const plot = $derived(getPlotState());
|
|
@@ -50,7 +60,7 @@
|
|
|
50
60
|
{...args}>
|
|
51
61
|
{#snippet children({ scaledData, usedScales })}
|
|
52
62
|
<GroupMultiple class="bar-y" length={scaledData.length}>
|
|
53
|
-
{#each scaledData as d}
|
|
63
|
+
{#each scaledData as d, i (i)}
|
|
54
64
|
{@const bw = plot.scales.x.fn.bandwidth()}
|
|
55
65
|
{@const miny = Math.min(d.y1, d.y2)}
|
|
56
66
|
{@const maxy = Math.max(d.y1, d.y2)}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import type { BaseMarkProps, BaseRectMarkProps } from '../types.js';
|
|
2
|
-
|
|
3
|
-
type BarYProps = BaseMarkProps & BaseRectMarkProps & {
|
|
1
|
+
import type { BaseMarkProps, BaseRectMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
2
|
+
export type BarYMarkProps = BaseMarkProps & BaseRectMarkProps & {
|
|
4
3
|
data: DataRow[];
|
|
5
4
|
x?: ChannelAccessor;
|
|
6
5
|
y?: ChannelAccessor;
|
|
@@ -13,7 +12,8 @@ type BarYProps = BaseMarkProps & BaseRectMarkProps & {
|
|
|
13
12
|
*/
|
|
14
13
|
interval?: number | string;
|
|
15
14
|
};
|
|
15
|
+
import type { StackOptions } from '../transforms/stack.js';
|
|
16
16
|
/** For vertical column charts using a band scale as x axis */
|
|
17
|
-
declare const BarY: import("svelte").Component<
|
|
17
|
+
declare const BarY: import("svelte").Component<BarYMarkProps, {}, "">;
|
|
18
18
|
type BarY = ReturnType<typeof BarY>;
|
|
19
19
|
export default BarY;
|
|
@@ -2,12 +2,8 @@
|
|
|
2
2
|
@component
|
|
3
3
|
line representing a moving average and an area representing volatility as a band
|
|
4
4
|
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
|
|
7
|
-
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
8
|
-
import { pick } from 'es-toolkit';
|
|
9
|
-
|
|
10
|
-
type BollingerXProps = BaseMarkProps & {
|
|
5
|
+
<script module lang="ts">
|
|
6
|
+
export type BollingerXMarkProps = BaseMarkProps & {
|
|
11
7
|
data: DataRow[];
|
|
12
8
|
x?: ChannelAccessor;
|
|
13
9
|
y?: ChannelAccessor;
|
|
@@ -20,8 +16,20 @@
|
|
|
20
16
|
*/
|
|
21
17
|
k?: number;
|
|
22
18
|
};
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<script lang="ts">
|
|
22
|
+
import { Area, Line, bollingerX, recordizeX } from '../index.js';
|
|
23
|
+
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
24
|
+
import { pick } from 'es-toolkit';
|
|
23
25
|
|
|
24
|
-
let {
|
|
26
|
+
let {
|
|
27
|
+
data,
|
|
28
|
+
class: className = null,
|
|
29
|
+
n = 20,
|
|
30
|
+
k = 2,
|
|
31
|
+
...options
|
|
32
|
+
}: BollingerXMarkProps = $props();
|
|
25
33
|
|
|
26
34
|
let args = $derived(bollingerX(recordizeX({ data, ...options }), { n, k }));
|
|
27
35
|
</script>
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
type BollingerXProps = BaseMarkProps & {
|
|
1
|
+
export type BollingerXMarkProps = BaseMarkProps & {
|
|
3
2
|
data: DataRow[];
|
|
4
3
|
x?: ChannelAccessor;
|
|
5
4
|
y?: ChannelAccessor;
|
|
@@ -12,7 +11,8 @@ type BollingerXProps = BaseMarkProps & {
|
|
|
12
11
|
*/
|
|
13
12
|
k?: number;
|
|
14
13
|
};
|
|
14
|
+
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
15
15
|
/** line representing a moving average and an area representing volatility as a band */
|
|
16
|
-
declare const BollingerX: import("svelte").Component<
|
|
16
|
+
declare const BollingerX: import("svelte").Component<any, {}, "">;
|
|
17
17
|
type BollingerX = ReturnType<typeof BollingerX>;
|
|
18
18
|
export default BollingerX;
|
|
@@ -2,12 +2,8 @@
|
|
|
2
2
|
@component
|
|
3
3
|
line representing a moving average and an area representing volatility as a band
|
|
4
4
|
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
|
|
7
|
-
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
8
|
-
import { pick } from 'es-toolkit';
|
|
9
|
-
|
|
10
|
-
type BollingerYProps = BaseMarkProps & {
|
|
5
|
+
<script module lang="ts">
|
|
6
|
+
export type BollingerYMarkProps = BaseMarkProps & {
|
|
11
7
|
data: DataRow[];
|
|
12
8
|
x?: ChannelAccessor;
|
|
13
9
|
y?: ChannelAccessor;
|
|
@@ -20,8 +16,14 @@
|
|
|
20
16
|
*/
|
|
21
17
|
k?: number;
|
|
22
18
|
};
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<script lang="ts">
|
|
22
|
+
import { Area, Line, bollingerY, recordizeY } from '../index.js';
|
|
23
|
+
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
24
|
+
import { pick } from 'es-toolkit';
|
|
23
25
|
|
|
24
|
-
let { data, n = 20, k = 2, class: className, ...options }:
|
|
26
|
+
let { data, n = 20, k = 2, class: className, ...options }: BollingerYMarkProps = $props();
|
|
25
27
|
|
|
26
28
|
const args = $derived(bollingerY(recordizeY({ data, ...options }), { n, k }));
|
|
27
29
|
</script>
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
type BollingerYProps = BaseMarkProps & {
|
|
1
|
+
export type BollingerYMarkProps = BaseMarkProps & {
|
|
3
2
|
data: DataRow[];
|
|
4
3
|
x?: ChannelAccessor;
|
|
5
4
|
y?: ChannelAccessor;
|
|
@@ -12,7 +11,8 @@ type BollingerYProps = BaseMarkProps & {
|
|
|
12
11
|
*/
|
|
13
12
|
k?: number;
|
|
14
13
|
};
|
|
14
|
+
import type { BaseMarkProps, ChannelAccessor, DataRow } from '../types.js';
|
|
15
15
|
/** line representing a moving average and an area representing volatility as a band */
|
|
16
|
-
declare const BollingerY: import("svelte").Component<
|
|
16
|
+
declare const BollingerY: import("svelte").Component<any, {}, "">;
|
|
17
17
|
type BollingerY = ReturnType<typeof BollingerY>;
|
|
18
18
|
export default BollingerY;
|
package/dist/marks/BoxX.svelte
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { BoxProps } from './BoxY.svelte';
|
|
2
|
+
/** Creates a horizontal box plot for visualizing data distribution with quartiles and outliers */
|
|
2
3
|
declare const BoxX: import("svelte").Component<BoxProps, {}, "">;
|
|
3
4
|
type BoxX = ReturnType<typeof BoxX>;
|
|
4
5
|
export default BoxX;
|
package/dist/marks/BoxY.svelte
CHANGED
|
@@ -24,6 +24,7 @@ export type BoxProps = {
|
|
|
24
24
|
dot: Record<string, ChannelAccessor>;
|
|
25
25
|
};
|
|
26
26
|
import type { ChannelAccessor, DataRecord } from '../types.js';
|
|
27
|
+
/** Creates a vertical box plot for visualizing data distribution with quartiles and outliers */
|
|
27
28
|
declare const BoxY: import("svelte").Component<BoxProps, {}, "">;
|
|
28
29
|
type BoxY = ReturnType<typeof BoxY>;
|
|
29
30
|
export default BoxY;
|
package/dist/marks/BrushX.svelte
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
|
+
<script module type="ts">
|
|
2
|
+
export type BrushXMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
|
|
3
|
+
</script>
|
|
4
|
+
|
|
1
5
|
<script lang="ts">
|
|
2
6
|
import Brush, { type BrushMarkProps } from './Brush.svelte';
|
|
3
7
|
|
|
4
|
-
let { brush, ...restProps }:
|
|
8
|
+
let { brush, ...restProps }: BrushXMarkProps = $props();
|
|
5
9
|
</script>
|
|
6
10
|
|
|
7
11
|
<Brush bind:brush limitDimension="x" {...restProps} />
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
+
export type BrushXMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
|
|
1
2
|
import { type BrushMarkProps } from './Brush.svelte';
|
|
2
|
-
declare const BrushX: import("svelte").Component<
|
|
3
|
+
declare const BrushX: import("svelte").Component<BrushXMarkProps, {}, "">;
|
|
3
4
|
type BrushX = ReturnType<typeof BrushX>;
|
|
4
5
|
export default BrushX;
|
package/dist/marks/BrushY.svelte
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
|
+
<script module type="ts">
|
|
2
|
+
export type BrushYMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
|
|
3
|
+
</script>
|
|
4
|
+
|
|
1
5
|
<script lang="ts">
|
|
2
6
|
import Brush, { type BrushMarkProps } from './Brush.svelte';
|
|
3
7
|
|
|
4
|
-
let { brush, ...restProps }:
|
|
8
|
+
let { brush, ...restProps }: BrushYMarkProps = $props();
|
|
5
9
|
</script>
|
|
6
10
|
|
|
7
11
|
<Brush bind:brush limitDimension="y" {...restProps} />
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
+
export type BrushYMarkProps = Omit<BrushMarkProps, 'limitDimension'>;
|
|
1
2
|
import { type BrushMarkProps } from './Brush.svelte';
|
|
2
|
-
declare const BrushY: import("svelte").Component<
|
|
3
|
+
declare const BrushY: import("svelte").Component<BrushYMarkProps, {}, "">;
|
|
3
4
|
type BrushY = ReturnType<typeof BrushY>;
|
|
4
5
|
export default BrushY;
|
package/dist/marks/Cell.svelte
CHANGED
|
@@ -2,11 +2,7 @@
|
|
|
2
2
|
@component
|
|
3
3
|
For arbitrary rectangles, requires band x and y scales
|
|
4
4
|
-->
|
|
5
|
-
<script lang="ts">
|
|
6
|
-
import Mark from '../Mark.svelte';
|
|
7
|
-
import { getContext } from 'svelte';
|
|
8
|
-
import { recordizeY, sort } from '../index.js';
|
|
9
|
-
import { resolveChannel } from '../helpers/resolve.js';
|
|
5
|
+
<script module lang="ts">
|
|
10
6
|
import type {
|
|
11
7
|
PlotContext,
|
|
12
8
|
DataRecord,
|
|
@@ -14,24 +10,25 @@
|
|
|
14
10
|
BaseRectMarkProps,
|
|
15
11
|
ChannelAccessor
|
|
16
12
|
} from '../types.js';
|
|
13
|
+
|
|
14
|
+
export type CellMarkProps = BaseMarkProps &
|
|
15
|
+
BaseRectMarkProps & {
|
|
16
|
+
data: DataRecord[];
|
|
17
|
+
x?: ChannelAccessor;
|
|
18
|
+
y?: ChannelAccessor;
|
|
19
|
+
};
|
|
20
|
+
</script>
|
|
21
|
+
|
|
22
|
+
<script lang="ts">
|
|
23
|
+
import Mark from '../Mark.svelte';
|
|
24
|
+
import { getContext } from 'svelte';
|
|
25
|
+
import { recordizeY, sort } from '../index.js';
|
|
26
|
+
import { resolveChannel } from '../helpers/resolve.js';
|
|
27
|
+
|
|
17
28
|
import { isValid } from '../helpers/isValid.js';
|
|
18
29
|
import RectPath from './helpers/RectPath.svelte';
|
|
19
30
|
|
|
20
|
-
|
|
21
|
-
data: DataRecord[];
|
|
22
|
-
x?: ChannelAccessor;
|
|
23
|
-
y?: ChannelAccessor;
|
|
24
|
-
borderRadius?:
|
|
25
|
-
| number
|
|
26
|
-
| {
|
|
27
|
-
topLeft?: number;
|
|
28
|
-
topRight?: number;
|
|
29
|
-
bottomRight?: number;
|
|
30
|
-
bottomLeft?: number;
|
|
31
|
-
};
|
|
32
|
-
} & BaseRectMarkProps;
|
|
33
|
-
|
|
34
|
-
let { data = [{}], class: className = null, ...options }: CellProps = $props();
|
|
31
|
+
let { data = [{}], class: className = null, ...options }: CellMarkProps = $props();
|
|
35
32
|
|
|
36
33
|
const { getPlotState } = getContext<PlotContext>('svelteplot');
|
|
37
34
|
const plot = $derived(getPlotState());
|
|
@@ -61,7 +58,7 @@
|
|
|
61
58
|
{@const bwx = plot.scales.x.fn.bandwidth()}
|
|
62
59
|
{@const bwy = plot.scales.y.fn.bandwidth()}
|
|
63
60
|
<g class="cell {className || ''}" data-fill={usedScales.fillOpacity}>
|
|
64
|
-
{#each scaledData as d}
|
|
61
|
+
{#each scaledData as d, i (i)}
|
|
65
62
|
{#if d.valid && (args.fill == null || isValid(resolveChannel('fill', d.datum, args)))}
|
|
66
63
|
<RectPath
|
|
67
64
|
datum={d}
|
|
@@ -1,16 +1,10 @@
|
|
|
1
1
|
import type { DataRecord, BaseMarkProps, BaseRectMarkProps, ChannelAccessor } from '../types.js';
|
|
2
|
-
type
|
|
2
|
+
export type CellMarkProps = BaseMarkProps & BaseRectMarkProps & {
|
|
3
3
|
data: DataRecord[];
|
|
4
4
|
x?: ChannelAccessor;
|
|
5
5
|
y?: ChannelAccessor;
|
|
6
|
-
|
|
7
|
-
topLeft?: number;
|
|
8
|
-
topRight?: number;
|
|
9
|
-
bottomRight?: number;
|
|
10
|
-
bottomLeft?: number;
|
|
11
|
-
};
|
|
12
|
-
} & BaseRectMarkProps;
|
|
6
|
+
};
|
|
13
7
|
/** For arbitrary rectangles, requires band x and y scales */
|
|
14
|
-
declare const Cell: import("svelte").Component<
|
|
8
|
+
declare const Cell: import("svelte").Component<CellMarkProps, {}, "">;
|
|
15
9
|
type Cell = ReturnType<typeof Cell>;
|
|
16
10
|
export default Cell;
|
package/dist/marks/CellX.svelte
CHANGED
|
@@ -1,20 +1,15 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
export type CellXMarkProps = Omit<CellMarkProps, 'y'>;
|
|
3
|
+
</script>
|
|
4
|
+
|
|
1
5
|
<script lang="ts">
|
|
2
|
-
import Cell from './Cell.svelte';
|
|
6
|
+
import Cell, { type CellMarkProps } from './Cell.svelte';
|
|
3
7
|
import { recordizeY } from '../index.js';
|
|
4
|
-
import type { BaseMarkProps, DataRow, RectMarkProps } from '../types.js';
|
|
5
|
-
import type { ChannelAccessor } from '../types.js';
|
|
6
|
-
|
|
7
|
-
type CellXProps = BaseMarkProps & {
|
|
8
|
-
data: DataRow[];
|
|
9
|
-
x?: ChannelAccessor;
|
|
10
|
-
fill?: ChannelAccessor;
|
|
11
|
-
stroke?: ChannelAccessor;
|
|
12
|
-
} & RectMarkProps;
|
|
13
8
|
|
|
14
|
-
let { data = [{}], ...options }:
|
|
9
|
+
let { data = [{}], ...options }: CellXMarkProps = $props();
|
|
15
10
|
|
|
16
11
|
const args = $derived(
|
|
17
|
-
recordizeY<
|
|
12
|
+
recordizeY<CellXMarkProps>({
|
|
18
13
|
data,
|
|
19
14
|
...options
|
|
20
15
|
})
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
export type CellXMarkProps = Omit<CellMarkProps, 'y'>;
|
|
2
|
+
import { type CellMarkProps } from './Cell.svelte';
|
|
3
|
+
declare const CellX: import("svelte").Component<CellXMarkProps, {}, "">;
|
|
2
4
|
type CellX = ReturnType<typeof CellX>;
|
|
3
5
|
export default CellX;
|
package/dist/marks/CellY.svelte
CHANGED
|
@@ -1,20 +1,15 @@
|
|
|
1
|
+
<script module lang="ts">
|
|
2
|
+
export type CellYMarkProps = Omit<CellMarkProps, 'x'>;
|
|
3
|
+
</script>
|
|
4
|
+
|
|
1
5
|
<script lang="ts">
|
|
2
|
-
import Cell from './Cell.svelte';
|
|
6
|
+
import Cell, { type CellMarkProps } from './Cell.svelte';
|
|
3
7
|
import { recordizeX } from '../index.js';
|
|
4
|
-
import type { BaseMarkProps, DataRow, RectMarkProps } from '../types.js';
|
|
5
|
-
import type { ChannelAccessor } from '../types.js';
|
|
6
|
-
|
|
7
|
-
type CellYProps = BaseMarkProps & {
|
|
8
|
-
data: DataRow[];
|
|
9
|
-
y?: ChannelAccessor;
|
|
10
|
-
fill?: ChannelAccessor;
|
|
11
|
-
stroke?: ChannelAccessor;
|
|
12
|
-
} & RectMarkProps;
|
|
13
8
|
|
|
14
|
-
let { data = [{}], ...options }:
|
|
9
|
+
let { data = [{}], ...options }: CellYMarkProps = $props();
|
|
15
10
|
|
|
16
11
|
const args = $derived(
|
|
17
|
-
recordizeX<
|
|
12
|
+
recordizeX<CellYMarkProps>({
|
|
18
13
|
data,
|
|
19
14
|
...options
|
|
20
15
|
})
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
export type CellYMarkProps = Omit<CellMarkProps, 'x'>;
|
|
2
|
+
import { type CellMarkProps } from './Cell.svelte';
|
|
3
|
+
declare const CellY: import("svelte").Component<CellYMarkProps, {}, "">;
|
|
2
4
|
type CellY = ReturnType<typeof CellY>;
|
|
3
5
|
export default CellY;
|