svelteplot 0.5.2-pr-251.3 → 0.5.2-pr-252.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/marks/CustomMark.svelte +3 -9
- package/dist/marks/helpers/Anchor.svelte +2 -16
- package/dist/marks/helpers/Anchor.svelte.d.ts +14 -28
- package/dist/marks/helpers/BaseAxisX.svelte +2 -2
- package/dist/marks/helpers/BaseAxisX.svelte.d.ts +1 -1
- package/dist/marks/helpers/BaseAxisY.svelte +2 -2
- package/dist/marks/helpers/BaseAxisY.svelte.d.ts +1 -1
- package/dist/marks/index.d.ts +0 -1
- package/dist/marks/index.js +0 -1
- package/dist/types/plot.d.ts +1 -5
- package/package.json +1 -1
- package/dist/marks/Image.svelte +0 -76
- package/dist/marks/Image.svelte.d.ts +0 -19
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
<script lang="ts" generics="Datum extends DataRecord">
|
|
6
6
|
interface CustomMarkProps extends BaseMarkProps<Datum> {
|
|
7
7
|
data?: Datum[];
|
|
8
|
-
type?: string;
|
|
9
8
|
x?: ChannelAccessor<Datum>;
|
|
10
9
|
x1?: ChannelAccessor<Datum>;
|
|
11
10
|
x2?: ChannelAccessor<Datum>;
|
|
@@ -19,6 +18,7 @@
|
|
|
19
18
|
marks?: Snippet<[{ records: ScaledDataRecord<Datum>[]; usedScales: UsedScales }]>;
|
|
20
19
|
}
|
|
21
20
|
|
|
21
|
+
import { getContext } from 'svelte';
|
|
22
22
|
import type {
|
|
23
23
|
PlotContext,
|
|
24
24
|
DataRecord,
|
|
@@ -33,13 +33,7 @@
|
|
|
33
33
|
|
|
34
34
|
import Mark from '../Mark.svelte';
|
|
35
35
|
|
|
36
|
-
let {
|
|
37
|
-
data = [{} as Datum],
|
|
38
|
-
mark,
|
|
39
|
-
type = 'custom',
|
|
40
|
-
marks,
|
|
41
|
-
...options
|
|
42
|
-
}: CustomMarkProps = $props();
|
|
36
|
+
let { data = [{} as Datum], mark, marks, ...options }: CustomMarkProps = $props();
|
|
43
37
|
|
|
44
38
|
const args = $derived(sort({ data, ...options })) as CustomMarkProps;
|
|
45
39
|
|
|
@@ -59,7 +53,7 @@
|
|
|
59
53
|
];
|
|
60
54
|
</script>
|
|
61
55
|
|
|
62
|
-
<Mark
|
|
56
|
+
<Mark type="custom" required={[]} channels={channels.filter((d) => !!options[d])} {...args}>
|
|
63
57
|
{#snippet children({ scaledData, usedScales })}
|
|
64
58
|
{#if marks}
|
|
65
59
|
{@render marks({ records: scaledData.filter((d) => d.valid), usedScales })}
|
|
@@ -1,21 +1,7 @@
|
|
|
1
|
-
<script
|
|
1
|
+
<script>
|
|
2
2
|
import { resolveProp } from '../../helpers/resolve.js';
|
|
3
|
-
import type { ConstantAccessor } from '../../types';
|
|
4
3
|
|
|
5
|
-
|
|
6
|
-
datum?: Datum;
|
|
7
|
-
options?: {
|
|
8
|
-
href?: ConstantAccessor<string, Datum>;
|
|
9
|
-
target?: ConstantAccessor<string, Datum>;
|
|
10
|
-
rel?: ConstantAccessor<string, Datum>;
|
|
11
|
-
type?: ConstantAccessor<string, Datum>;
|
|
12
|
-
download?: ConstantAccessor<string, Datum>;
|
|
13
|
-
[key: string]: any;
|
|
14
|
-
};
|
|
15
|
-
children?: () => any;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
let { datum = {}, options = {}, children }: AnchorProps = $props();
|
|
4
|
+
let { datum = {}, options = {}, children } = $props();
|
|
19
5
|
|
|
20
6
|
const href = $derived(resolveProp(options.href, datum, null));
|
|
21
7
|
const target = $derived(resolveProp(options.target, datum, null));
|
|
@@ -1,29 +1,15 @@
|
|
|
1
|
-
import type { ConstantAccessor } from '../../types';
|
|
2
|
-
declare class __sveltets_Render<Datum extends Record<string, any>> {
|
|
3
|
-
props(): {
|
|
4
|
-
datum?: Datum | undefined;
|
|
5
|
-
options?: {
|
|
6
|
-
[key: string]: any;
|
|
7
|
-
href?: ConstantAccessor<string, Datum_1>;
|
|
8
|
-
target?: ConstantAccessor<string, Datum_1>;
|
|
9
|
-
rel?: ConstantAccessor<string, Datum_1>;
|
|
10
|
-
type?: ConstantAccessor<string, Datum_1>;
|
|
11
|
-
download?: ConstantAccessor<string, Datum_1>;
|
|
12
|
-
} | undefined;
|
|
13
|
-
children?: (() => any) | undefined;
|
|
14
|
-
};
|
|
15
|
-
events(): {};
|
|
16
|
-
slots(): {};
|
|
17
|
-
bindings(): "";
|
|
18
|
-
exports(): {};
|
|
19
|
-
}
|
|
20
|
-
interface $$IsomorphicComponent {
|
|
21
|
-
new <Datum extends Record<string, any>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Datum>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Datum>['props']>, ReturnType<__sveltets_Render<Datum>['events']>, ReturnType<__sveltets_Render<Datum>['slots']>> & {
|
|
22
|
-
$$bindings?: ReturnType<__sveltets_Render<Datum>['bindings']>;
|
|
23
|
-
} & ReturnType<__sveltets_Render<Datum>['exports']>;
|
|
24
|
-
<Datum extends Record<string, any>>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
|
|
25
|
-
z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
|
|
26
|
-
}
|
|
27
|
-
declare const Anchor: $$IsomorphicComponent;
|
|
28
|
-
type Anchor<Datum extends Record<string, any>> = InstanceType<typeof Anchor<Datum>>;
|
|
29
1
|
export default Anchor;
|
|
2
|
+
type Anchor = {
|
|
3
|
+
$on?(type: string, callback: (e: any) => void): () => void;
|
|
4
|
+
$set?(props: Partial<$$ComponentProps>): void;
|
|
5
|
+
};
|
|
6
|
+
declare const Anchor: import("svelte").Component<{
|
|
7
|
+
datum?: Record<string, any>;
|
|
8
|
+
options?: Record<string, any>;
|
|
9
|
+
children: any;
|
|
10
|
+
}, {}, "">;
|
|
11
|
+
type $$ComponentProps = {
|
|
12
|
+
datum?: Record<string, any>;
|
|
13
|
+
options?: Record<string, any>;
|
|
14
|
+
children: any;
|
|
15
|
+
};
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
scaleFn: (d: RawValue) => number;
|
|
23
23
|
scaleType: ScaleType;
|
|
24
24
|
ticks: RawValue[];
|
|
25
|
-
tickFormat: (d: RawValue, i: number) => string | string[];
|
|
25
|
+
tickFormat: (d: RawValue, i: number, ticks: RawValue[]) => string | string[];
|
|
26
26
|
anchor: 'top' | 'bottom';
|
|
27
27
|
tickSize: number;
|
|
28
28
|
tickPadding: number;
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
dx: +resolveProp(options.dx, datum, 0),
|
|
88
88
|
dy: +resolveProp(options.dy, datum, 0),
|
|
89
89
|
x: scaleFn(tick) + (scaleType === 'band' ? scaleFn.bandwidth() * 0.5 : 0),
|
|
90
|
-
text: splitTick(tickFormat(tick, i)),
|
|
90
|
+
text: splitTick(tickFormat(tick, i, ticks)),
|
|
91
91
|
element: null as SVGTextElement | null
|
|
92
92
|
};
|
|
93
93
|
})
|
|
@@ -3,7 +3,7 @@ type BaseAxisXProps = {
|
|
|
3
3
|
scaleFn: (d: RawValue) => number;
|
|
4
4
|
scaleType: ScaleType;
|
|
5
5
|
ticks: RawValue[];
|
|
6
|
-
tickFormat: (d: RawValue, i: number) => string | string[];
|
|
6
|
+
tickFormat: (d: RawValue, i: number, ticks: RawValue[]) => string | string[];
|
|
7
7
|
anchor: 'top' | 'bottom';
|
|
8
8
|
tickSize: number;
|
|
9
9
|
tickPadding: number;
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
scaleFn: (d: RawValue) => number;
|
|
20
20
|
scaleType: ScaleType;
|
|
21
21
|
ticks: RawValue[];
|
|
22
|
-
tickFormat: (d: RawValue) => string | string[];
|
|
22
|
+
tickFormat: (d: RawValue, i: number, ticks: RawValue[]) => string | string[];
|
|
23
23
|
anchor: 'left' | 'right';
|
|
24
24
|
lineAnchor: 'top' | 'center' | 'bottom';
|
|
25
25
|
tickSize: number;
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
dx: +resolveProp(options.dx, datum, 0),
|
|
73
73
|
dy: +resolveProp(options.dy, datum, 0),
|
|
74
74
|
y: scaleFn(tick) + (scaleType === 'band' ? scaleFn.bandwidth() * 0.5 : 0),
|
|
75
|
-
text: tickFormat(tick, i),
|
|
75
|
+
text: tickFormat(tick, i, ticks),
|
|
76
76
|
element: null as SVGTextElement | null
|
|
77
77
|
};
|
|
78
78
|
});
|
|
@@ -3,7 +3,7 @@ type BaseAxisYProps = {
|
|
|
3
3
|
scaleFn: (d: RawValue) => number;
|
|
4
4
|
scaleType: ScaleType;
|
|
5
5
|
ticks: RawValue[];
|
|
6
|
-
tickFormat: (d: RawValue) => string | string[];
|
|
6
|
+
tickFormat: (d: RawValue, i: number, ticks: RawValue[]) => string | string[];
|
|
7
7
|
anchor: 'left' | 'right';
|
|
8
8
|
lineAnchor: 'top' | 'center' | 'bottom';
|
|
9
9
|
tickSize: number;
|
package/dist/marks/index.d.ts
CHANGED
|
@@ -27,7 +27,6 @@ export { default as Geo } from './Geo.svelte';
|
|
|
27
27
|
export { default as Graticule } from './Graticule.svelte';
|
|
28
28
|
export { default as GridX } from './GridX.svelte';
|
|
29
29
|
export { default as GridY } from './GridY.svelte';
|
|
30
|
-
export { default as Image } from './Image.svelte';
|
|
31
30
|
export { default as Line } from './Line.svelte';
|
|
32
31
|
export { default as LineX } from './LineX.svelte';
|
|
33
32
|
export { default as LineY } from './LineY.svelte';
|
package/dist/marks/index.js
CHANGED
|
@@ -27,7 +27,6 @@ export { default as Geo } from './Geo.svelte';
|
|
|
27
27
|
export { default as Graticule } from './Graticule.svelte';
|
|
28
28
|
export { default as GridX } from './GridX.svelte';
|
|
29
29
|
export { default as GridY } from './GridY.svelte';
|
|
30
|
-
export { default as Image } from './Image.svelte';
|
|
31
30
|
export { default as Line } from './Line.svelte';
|
|
32
31
|
export { default as LineX } from './LineX.svelte';
|
|
33
32
|
export { default as LineY } from './LineY.svelte';
|
package/dist/types/plot.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import type { ColorScheme } from './colorScheme.js';
|
|
|
3
3
|
import type { GeoProjection } from 'd3-geo';
|
|
4
4
|
import type { ChannelAccessor, ChannelName, ColorScaleOptions, DataRecord, LegendScaleOptions, PlotScales, ScaleOptions, XScaleOptions, YScaleOptions } from './index.js';
|
|
5
5
|
import type { Snippet } from 'svelte';
|
|
6
|
-
import type { Area, AreaX, AreaY, Arrow, AxisX, AxisY, BarX, BarY, BoxX, BoxY, Brush, BrushX, BrushY, Cell, DifferenceY, Dot, Frame, Geo, Graticule, GridX, GridY,
|
|
6
|
+
import type { Area, AreaX, AreaY, Arrow, AxisX, AxisY, BarX, BarY, BoxX, BoxY, Brush, BrushX, BrushY, Cell, DifferenceY, Dot, Frame, Geo, Graticule, GridX, GridY, Line, Link, Pointer, Rect, RectX, RectY, RuleX, RuleY, Sphere, Spike, Text, TickX, TickY, Vector } from '../marks/index.js';
|
|
7
7
|
export type PlotState = {
|
|
8
8
|
width: number;
|
|
9
9
|
height: number;
|
|
@@ -230,10 +230,6 @@ export type PlotDefaults = {
|
|
|
230
230
|
gridY: Partial<Omit<ComponentProps<typeof GridY>, IgnoreDefaults> & {
|
|
231
231
|
implicit: boolean;
|
|
232
232
|
}>;
|
|
233
|
-
/**
|
|
234
|
-
* default props for image marks
|
|
235
|
-
*/
|
|
236
|
-
image: Partial<Omit<ComponentProps<typeof Image>, IgnoreDefaults>>;
|
|
237
233
|
/**
|
|
238
234
|
* default props for line marks
|
|
239
235
|
*/
|
package/package.json
CHANGED
package/dist/marks/Image.svelte
DELETED
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
@component
|
|
3
|
-
For showing images positioned at x/y coordinates
|
|
4
|
-
-->
|
|
5
|
-
<script lang="ts" generics="Datum extends DataRecord">
|
|
6
|
-
interface ImageMarkProps extends BaseMarkProps<Datum>, LinkableMarkProps<Datum> {
|
|
7
|
-
data: Datum[];
|
|
8
|
-
x: ChannelAccessor<Datum>;
|
|
9
|
-
y: ChannelAccessor<Datum>;
|
|
10
|
-
r?: ChannelAccessor<Datum>;
|
|
11
|
-
width?: ConstantAccessor<number, Datum>;
|
|
12
|
-
height?: ConstantAccessor<number, Datum>;
|
|
13
|
-
src?: ConstantAccessor<string, Datum>;
|
|
14
|
-
title?: ConstantAccessor<string, Datum>;
|
|
15
|
-
preserveAspectRatio?: string;
|
|
16
|
-
// canvas?: boolean;
|
|
17
|
-
imageClass?: ConstantAccessor<string, Datum>;
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
import type {
|
|
21
|
-
BaseMarkProps,
|
|
22
|
-
ChannelAccessor,
|
|
23
|
-
ConstantAccessor,
|
|
24
|
-
DataRecord,
|
|
25
|
-
LinkableMarkProps
|
|
26
|
-
} from '../types';
|
|
27
|
-
import { resolveProp } from '../helpers/resolve';
|
|
28
|
-
import CustomMark from './CustomMark.svelte';
|
|
29
|
-
import { getPlotDefaults } from '../hooks/plotDefaults';
|
|
30
|
-
import { sort } from '../transforms';
|
|
31
|
-
import Anchor from './helpers/Anchor.svelte';
|
|
32
|
-
|
|
33
|
-
let markProps: ImageMarkProps = $props();
|
|
34
|
-
|
|
35
|
-
const DEFAULTS: Partial<ImageMarkProps> = {
|
|
36
|
-
width: 20,
|
|
37
|
-
preserveAspectRatio: 'xMidYMin slice',
|
|
38
|
-
...getPlotDefaults().image
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
const {
|
|
42
|
-
data = [{} as Datum],
|
|
43
|
-
width,
|
|
44
|
-
height,
|
|
45
|
-
src,
|
|
46
|
-
title,
|
|
47
|
-
imageClass,
|
|
48
|
-
preserveAspectRatio,
|
|
49
|
-
...options
|
|
50
|
-
}: ImageMarkProps = $derived({
|
|
51
|
-
...DEFAULTS,
|
|
52
|
-
...markProps
|
|
53
|
-
});
|
|
54
|
-
|
|
55
|
-
const args = $derived(sort({ data, ...options }));
|
|
56
|
-
</script>
|
|
57
|
-
|
|
58
|
-
<CustomMark type="image" {...args}>
|
|
59
|
-
{#snippet mark({ record, index, usedScales })}
|
|
60
|
-
{@const w = record.r !== undefined ? record.r * 2 : resolveProp(width, record.datum, 20)}
|
|
61
|
-
{@const h =
|
|
62
|
-
record.r !== undefined ? record.r * 2 : resolveProp(height || width, record.datum, 20)}
|
|
63
|
-
<Anchor {options} datum={record.datum}>
|
|
64
|
-
<image
|
|
65
|
-
class={resolveProp(imageClass, record.datum, null)}
|
|
66
|
-
href={resolveProp(src, record.datum, '')}
|
|
67
|
-
x={record.x - w * 0.5}
|
|
68
|
-
y={record.y - h * 0.5}
|
|
69
|
-
{preserveAspectRatio}
|
|
70
|
-
clip-path={record.r !== undefined ? `circle(${record.r}px)` : null}
|
|
71
|
-
width={w}
|
|
72
|
-
height={h}
|
|
73
|
-
>{#if title}<title>{resolveProp(title, record.datum, '')}</title>{/if}</image>
|
|
74
|
-
</Anchor>
|
|
75
|
-
{/snippet}
|
|
76
|
-
</CustomMark>
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import type { DataRecord } from '../types';
|
|
2
|
-
declare class __sveltets_Render<Datum extends DataRecord> {
|
|
3
|
-
props(): any;
|
|
4
|
-
events(): {};
|
|
5
|
-
slots(): {};
|
|
6
|
-
bindings(): "";
|
|
7
|
-
exports(): {};
|
|
8
|
-
}
|
|
9
|
-
interface $$IsomorphicComponent {
|
|
10
|
-
new <Datum extends DataRecord>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<Datum>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<Datum>['props']>, ReturnType<__sveltets_Render<Datum>['events']>, ReturnType<__sveltets_Render<Datum>['slots']>> & {
|
|
11
|
-
$$bindings?: ReturnType<__sveltets_Render<Datum>['bindings']>;
|
|
12
|
-
} & ReturnType<__sveltets_Render<Datum>['exports']>;
|
|
13
|
-
<Datum extends DataRecord>(internal: unknown, props: ReturnType<__sveltets_Render<Datum>['props']> & {}): ReturnType<__sveltets_Render<Datum>['exports']>;
|
|
14
|
-
z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
|
|
15
|
-
}
|
|
16
|
-
/** For showing images positioned at x/y coordinates */
|
|
17
|
-
declare const Image: $$IsomorphicComponent;
|
|
18
|
-
type Image<Datum extends DataRecord> = InstanceType<typeof Image<Datum>>;
|
|
19
|
-
export default Image;
|