@rokkit/chart 1.0.0-next.54 → 1.0.0-next.56
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/package.json +10 -10
- package/src/chart/Axis.svelte +8 -19
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rokkit/chart",
|
|
3
|
-
"version": "1.0.0-next.
|
|
3
|
+
"version": "1.0.0-next.56",
|
|
4
4
|
"description": "Components for making interactive charts.",
|
|
5
5
|
"author": "Jerry Thomas <me@jerrythomas.name>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -14,16 +14,16 @@
|
|
|
14
14
|
},
|
|
15
15
|
"devDependencies": {
|
|
16
16
|
"@sveltejs/vite-plugin-svelte": "^2.4.6",
|
|
17
|
-
"@testing-library/svelte": "^4.0.
|
|
17
|
+
"@testing-library/svelte": "^4.0.4",
|
|
18
18
|
"@vitest/coverage-v8": "^0.34.6",
|
|
19
19
|
"@vitest/ui": "~0.34.6",
|
|
20
20
|
"js-yaml": "^4.1.0",
|
|
21
21
|
"jsdom": "^22.1.0",
|
|
22
|
-
"svelte": "^4.2.
|
|
22
|
+
"svelte": "^4.2.2",
|
|
23
23
|
"typescript": "^5.2.2",
|
|
24
|
-
"vite": "^4.
|
|
24
|
+
"vite": "^4.5.0",
|
|
25
25
|
"vitest": "~0.34.6",
|
|
26
|
-
"shared-config": "1.0.0-next.
|
|
26
|
+
"shared-config": "1.0.0-next.56"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"d3-array": "^3.2.4",
|
|
@@ -33,12 +33,12 @@
|
|
|
33
33
|
"d3-scale": "^4.0.2",
|
|
34
34
|
"d3-shape": "^3.2.0",
|
|
35
35
|
"date-fns": "^2.30.0",
|
|
36
|
-
"ramda": "^0.29.
|
|
36
|
+
"ramda": "^0.29.1",
|
|
37
37
|
"yootils": "^0.3.1",
|
|
38
|
-
"@rokkit/atoms": "1.0.0-next.
|
|
39
|
-
"@rokkit/
|
|
40
|
-
"@rokkit/
|
|
41
|
-
"@rokkit/
|
|
38
|
+
"@rokkit/atoms": "1.0.0-next.56",
|
|
39
|
+
"@rokkit/molecules": "1.0.0-next.56",
|
|
40
|
+
"@rokkit/core": "1.0.0-next.56",
|
|
41
|
+
"@rokkit/stores": "1.0.0-next.56"
|
|
42
42
|
},
|
|
43
43
|
"files": [
|
|
44
44
|
"src/**/*.js",
|
package/src/chart/Axis.svelte
CHANGED
|
@@ -4,15 +4,11 @@
|
|
|
4
4
|
|
|
5
5
|
let chart = getContext('chart')
|
|
6
6
|
|
|
7
|
-
let top =
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
let
|
|
12
|
-
orient === 'right' ? $chart.width - $chart.margin.right : $chart.margin.left
|
|
13
|
-
let tickSizeInner = $chart.theme.tick.size.inner || 6
|
|
14
|
-
let tickSizeOuter = $chart.theme.tick.size.outer || 6
|
|
15
|
-
let tickPadding = $chart.theme.tick.size.padding || 3
|
|
7
|
+
let top = orient === 'bottom' ? $chart.height - $chart.margin?.bottom ?? 0 : $chart.margin.top
|
|
8
|
+
let left = orient === 'right' ? $chart.width - $chart.margin.right : $chart.margin?.left ?? 0
|
|
9
|
+
let tickSizeInner = $chart.theme.tick?.size?.inner || 6
|
|
10
|
+
let tickSizeOuter = $chart.theme.tick?.size?.outer || 6
|
|
11
|
+
let tickPadding = $chart.theme.tick?.size?.padding || 3
|
|
16
12
|
|
|
17
13
|
function axisPath(vertical, scale) {
|
|
18
14
|
const range = scale.range()
|
|
@@ -21,8 +17,7 @@
|
|
|
21
17
|
: `M${range[0]},${k * tickSizeOuter}V0H${range[1]}V${k * tickSizeOuter}`
|
|
22
18
|
}
|
|
23
19
|
|
|
24
|
-
$: anchor =
|
|
25
|
-
orient === 'right' ? 'start' : orient === 'left' ? 'end' : 'middle'
|
|
20
|
+
$: anchor = orient === 'right' ? 'start' : orient === 'left' ? 'end' : 'middle'
|
|
26
21
|
$: k = orient === 'top' || orient === 'left' ? -1 : 1
|
|
27
22
|
$: dy = orient === 'top' ? '0em' : orient === 'bottom' ? '0.71em' : '0.32em'
|
|
28
23
|
$: vertical = orient === 'left' || orient === 'right'
|
|
@@ -38,17 +33,11 @@
|
|
|
38
33
|
text-anchor={anchor}
|
|
39
34
|
class="axis"
|
|
40
35
|
>
|
|
41
|
-
<path
|
|
42
|
-
class="domain"
|
|
43
|
-
stroke="currentColor"
|
|
44
|
-
d="{axisPath(vertical, axis.scale)}}"
|
|
45
|
-
/>
|
|
36
|
+
<path class="domain" stroke="currentColor" d="{axisPath(vertical, axis.scale)}}" />
|
|
46
37
|
{#each axis.ticks as tick}
|
|
47
38
|
<g
|
|
48
39
|
class="tick"
|
|
49
|
-
transform="translate({vertical ? 0 : tick.position},{vertical
|
|
50
|
-
? tick.position
|
|
51
|
-
: 0})"
|
|
40
|
+
transform="translate({vertical ? 0 : tick.position},{vertical ? tick.position : 0})"
|
|
52
41
|
>
|
|
53
42
|
<line
|
|
54
43
|
stroke="currentColor"
|