@versatiles/style 5.5.0 → 5.5.2
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 +143 -30
- package/package.json +22 -22
package/README.MD
CHANGED
|
@@ -11,12 +11,12 @@
|
|
|
11
11
|
|
|
12
12
|
## Styles Overview
|
|
13
13
|
|
|
14
|
-
| Style Name | Preview
|
|
15
|
-
|
|
16
|
-
| **colorful** | <img width="384" src="
|
|
17
|
-
| **graybeard** | <img width="384" src="
|
|
18
|
-
| **eclipse** | <img width="384" src="
|
|
19
|
-
| **neutrino** | <img width="384" src="
|
|
14
|
+
| Style Name | Preview |
|
|
15
|
+
| ------------- | ----------------------------------------------------------------------------------------------------- |
|
|
16
|
+
| **colorful** | <img width="384" src="https://versatiles.org/versatiles-style/colorful.png" alt="colorful style" /> |
|
|
17
|
+
| **graybeard** | <img width="384" src="https://versatiles.org/versatiles-style/graybeard.png" alt="graybeard style" /> |
|
|
18
|
+
| **eclipse** | <img width="384" src="https://versatiles.org/versatiles-style/eclipse.png" alt="eclipse style" /> |
|
|
19
|
+
| **neutrino** | <img width="384" src="https://versatiles.org/versatiles-style/neutrino.png" alt="neutrino style" /> |
|
|
20
20
|
|
|
21
21
|
---
|
|
22
22
|
|
|
@@ -50,16 +50,16 @@ Integrate it into your HTML application:
|
|
|
50
50
|
<script src="maplibre-gl.js"></script>
|
|
51
51
|
<script src="versatiles-style.js"></script>
|
|
52
52
|
<script>
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
53
|
+
const style = VersaTilesStyle.graybeard({
|
|
54
|
+
language: "de",
|
|
55
|
+
colors: { label: "#222" },
|
|
56
|
+
recolor: { gamma: 0.5 },
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
const map = new maplibregl.Map({
|
|
60
|
+
container: "map",
|
|
61
|
+
style,
|
|
62
|
+
});
|
|
63
63
|
</script>
|
|
64
64
|
```
|
|
65
65
|
|
|
@@ -74,13 +74,13 @@ npm install @versatiles/style
|
|
|
74
74
|
Generate styles programmatically:
|
|
75
75
|
|
|
76
76
|
```javascript
|
|
77
|
-
import { colorful } from
|
|
78
|
-
import { writeFileSync } from
|
|
77
|
+
import { colorful } from "@versatiles/style";
|
|
78
|
+
import { writeFileSync } from "node:fs";
|
|
79
79
|
|
|
80
80
|
const style = colorful({
|
|
81
|
-
language:
|
|
81
|
+
language: "en",
|
|
82
82
|
});
|
|
83
|
-
writeFileSync(
|
|
83
|
+
writeFileSync("style.json", JSON.stringify(style));
|
|
84
84
|
```
|
|
85
85
|
|
|
86
86
|
---
|
|
@@ -89,19 +89,20 @@ writeFileSync('style.json', JSON.stringify(style));
|
|
|
89
89
|
|
|
90
90
|
The library offers the following style generation methods:
|
|
91
91
|
|
|
92
|
-
- `colorful(options)` - [Documentation](https://
|
|
93
|
-
- `eclipse(options)` - [Documentation](https://
|
|
94
|
-
- `graybeard(options)` - [Documentation](https://
|
|
95
|
-
- `neutrino(options)` - [Documentation](https://
|
|
92
|
+
- `colorful(options)` - [Documentation](https://versatiles.org/versatiles-style/functions/colorful.html)
|
|
93
|
+
- `eclipse(options)` - [Documentation](https://versatiles.org/versatiles-style/functions/eclipse.html)
|
|
94
|
+
- `graybeard(options)` - [Documentation](https://versatiles.org/versatiles-style/functions/graybeard.html)
|
|
95
|
+
- `neutrino(options)` - [Documentation](https://versatiles.org/versatiles-style/functions/neutrino.html)
|
|
96
96
|
|
|
97
|
-
**`options`**: An optional object to customize the styles. [Learn more](https://
|
|
97
|
+
**`options`**: An optional object to customize the styles. [Learn more](https://versatiles.org/versatiles-style/interfaces/StyleBuilderOptions.html)
|
|
98
98
|
|
|
99
99
|
### Guess Style Method
|
|
100
100
|
|
|
101
101
|
```javascript
|
|
102
102
|
const style = guessStyle(options);
|
|
103
103
|
```
|
|
104
|
-
|
|
104
|
+
|
|
105
|
+
[Documentation](https://versatiles.org/versatiles-style/functions/guessStyle.html)
|
|
105
106
|
|
|
106
107
|
---
|
|
107
108
|
|
|
@@ -131,12 +132,124 @@ Run the project in development mode:
|
|
|
131
132
|
npm run dev
|
|
132
133
|
```
|
|
133
134
|
|
|
134
|
-
A local server will be available at
|
|
135
|
-
|
|
136
|
-
|
|
135
|
+
A local server will be available at <http://localhost:8080>. Use it to select a style, edit definitions in `src/styles/...`, and reload the page to view the changes.
|
|
136
|
+
|
|
137
|
+
### Dependency Graph
|
|
138
|
+
|
|
139
|
+
<!--- This chapter is generated automatically --->
|
|
140
|
+
|
|
141
|
+
```mermaid
|
|
142
|
+
flowchart TB
|
|
143
|
+
|
|
144
|
+
subgraph 0["src"]
|
|
145
|
+
subgraph 1["color"]
|
|
146
|
+
2["abstract.ts"]
|
|
147
|
+
3["hsl.ts"]
|
|
148
|
+
4["hsv.ts"]
|
|
149
|
+
5["rgb.ts"]
|
|
150
|
+
6["utils.ts"]
|
|
151
|
+
7["index.ts"]
|
|
152
|
+
8["random.ts"]
|
|
153
|
+
end
|
|
154
|
+
subgraph 9["guess_style"]
|
|
155
|
+
A["guess_style.ts"]
|
|
156
|
+
X["index.ts"]
|
|
157
|
+
end
|
|
158
|
+
subgraph B["lib"]
|
|
159
|
+
C["utils.ts"]
|
|
160
|
+
end
|
|
161
|
+
subgraph D["styles"]
|
|
162
|
+
E["index.ts"]
|
|
163
|
+
F["colorful.ts"]
|
|
164
|
+
P["eclipse.ts"]
|
|
165
|
+
Q["empty.ts"]
|
|
166
|
+
R["graybeard.ts"]
|
|
167
|
+
S["neutrino.ts"]
|
|
168
|
+
end
|
|
169
|
+
subgraph G["style_builder"]
|
|
170
|
+
H["style_builder.ts"]
|
|
171
|
+
M["decorator.ts"]
|
|
172
|
+
O["recolor.ts"]
|
|
173
|
+
Z["types.ts"]
|
|
174
|
+
end
|
|
175
|
+
subgraph I["shortbread"]
|
|
176
|
+
J["index.ts"]
|
|
177
|
+
K["layers.ts"]
|
|
178
|
+
L["template.ts"]
|
|
179
|
+
N["properties.ts"]
|
|
180
|
+
end
|
|
181
|
+
subgraph T["types"]
|
|
182
|
+
U["index.ts"]
|
|
183
|
+
V["tilejson.ts"]
|
|
184
|
+
W["vector_layer.ts"]
|
|
185
|
+
10["maplibre.ts"]
|
|
186
|
+
end
|
|
187
|
+
Y["index.ts"]
|
|
188
|
+
end
|
|
189
|
+
3-->2
|
|
190
|
+
3-->4
|
|
191
|
+
3-->5
|
|
192
|
+
3-->6
|
|
193
|
+
4-->2
|
|
194
|
+
4-->3
|
|
195
|
+
4-->5
|
|
196
|
+
4-->6
|
|
197
|
+
5-->2
|
|
198
|
+
5-->3
|
|
199
|
+
5-->4
|
|
200
|
+
5-->6
|
|
201
|
+
7-->2
|
|
202
|
+
7-->3
|
|
203
|
+
7-->4
|
|
204
|
+
7-->8
|
|
205
|
+
7-->5
|
|
206
|
+
8-->4
|
|
207
|
+
8-->6
|
|
208
|
+
A-->7
|
|
209
|
+
A-->C
|
|
210
|
+
A-->E
|
|
211
|
+
A-->U
|
|
212
|
+
A-->V
|
|
213
|
+
C-->7
|
|
214
|
+
E-->F
|
|
215
|
+
E-->P
|
|
216
|
+
E-->Q
|
|
217
|
+
E-->R
|
|
218
|
+
E-->S
|
|
219
|
+
F-->H
|
|
220
|
+
H-->7
|
|
221
|
+
H-->C
|
|
222
|
+
H-->J
|
|
223
|
+
H-->M
|
|
224
|
+
H-->O
|
|
225
|
+
J-->K
|
|
226
|
+
J-->L
|
|
227
|
+
M-->7
|
|
228
|
+
M-->C
|
|
229
|
+
M-->N
|
|
230
|
+
O-->7
|
|
231
|
+
P-->F
|
|
232
|
+
Q-->F
|
|
233
|
+
R-->F
|
|
234
|
+
S-->F
|
|
235
|
+
U-->V
|
|
236
|
+
U-->W
|
|
237
|
+
X-->A
|
|
238
|
+
Y-->7
|
|
239
|
+
Y-->X
|
|
240
|
+
Y-->E
|
|
241
|
+
|
|
242
|
+
style 0 fill-opacity:0.2
|
|
243
|
+
style 1 fill-opacity:0.2
|
|
244
|
+
style 9 fill-opacity:0.2
|
|
245
|
+
style B fill-opacity:0.2
|
|
246
|
+
style D fill-opacity:0.2
|
|
247
|
+
style G fill-opacity:0.2
|
|
248
|
+
style I fill-opacity:0.2
|
|
249
|
+
style T fill-opacity:0.2
|
|
250
|
+
```
|
|
137
251
|
|
|
138
252
|
## Licenses
|
|
139
253
|
|
|
140
254
|
- **Source Code:** [Unlicense](./LICENSE.md)
|
|
141
255
|
- **Iconsets and Rendered Spritemaps:** [CC0 1.0 Universal](./icons/LICENSE.md)
|
|
142
|
-
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@versatiles/style",
|
|
3
|
-
"version": "5.5.
|
|
3
|
+
"version": "5.5.2",
|
|
4
4
|
"description": "Generate StyleJSON for MapLibre",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -12,14 +12,17 @@
|
|
|
12
12
|
"build-styles": "tsx scripts/build-styles.ts",
|
|
13
13
|
"build-sprites": "tsx scripts/build-sprites.ts",
|
|
14
14
|
"dev": "tsx scripts/dev.ts",
|
|
15
|
-
"doc": "
|
|
15
|
+
"doc": "npm run doc-graph",
|
|
16
|
+
"doc-graph": "vrt deps-graph | vrt doc-insert README.md '### Dependency Graph'",
|
|
17
|
+
"doc-screenshots": "tsx scripts/screenshots.ts",
|
|
18
|
+
"doc-typescript": "vrt doc-typescript -f html",
|
|
16
19
|
"lint": "eslint --color .",
|
|
17
|
-
"prepack": "npm run build
|
|
18
|
-
"release": "
|
|
20
|
+
"prepack": "npm run build",
|
|
21
|
+
"release": "vrt release-npm",
|
|
19
22
|
"test": "npm run test-typescript",
|
|
20
23
|
"test-coverage": "NODE_OPTIONS=--experimental-vm-modules jest --coverage",
|
|
21
24
|
"test-typescript": "NODE_OPTIONS=--experimental-vm-modules jest",
|
|
22
|
-
"upgrade": "
|
|
25
|
+
"upgrade": "vrt deps-upgrade"
|
|
23
26
|
},
|
|
24
27
|
"repository": {
|
|
25
28
|
"type": "git",
|
|
@@ -38,7 +41,7 @@
|
|
|
38
41
|
"devDependencies": {
|
|
39
42
|
"@maplibre/maplibre-gl-native": "^6.0.0",
|
|
40
43
|
"@maplibre/maplibre-gl-style-spec": "^23.1.0",
|
|
41
|
-
"@rollup/plugin-commonjs": "^28.0.
|
|
44
|
+
"@rollup/plugin-commonjs": "^28.0.3",
|
|
42
45
|
"@rollup/plugin-node-resolve": "^16.0.0",
|
|
43
46
|
"@rollup/plugin-terser": "^0.4.4",
|
|
44
47
|
"@rollup/plugin-typescript": "^12.1.2",
|
|
@@ -46,30 +49,27 @@
|
|
|
46
49
|
"@types/brace-expansion": "^1.1.2",
|
|
47
50
|
"@types/inquirer": "^9.0.7",
|
|
48
51
|
"@types/jest": "^29.5.14",
|
|
49
|
-
"@types/node": "^22.13.
|
|
52
|
+
"@types/node": "^22.13.10",
|
|
50
53
|
"@types/tar-stream": "^3.1.3",
|
|
51
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
52
|
-
"@typescript-eslint/parser": "^8.
|
|
53
|
-
"@versatiles/release-tool": "^
|
|
54
|
+
"@typescript-eslint/eslint-plugin": "^8.26.1",
|
|
55
|
+
"@typescript-eslint/parser": "^8.26.1",
|
|
56
|
+
"@versatiles/release-tool": "^2.3.1",
|
|
54
57
|
"bin-pack": "^1.0.2",
|
|
55
|
-
"esbuild": "
|
|
56
|
-
"eslint": "^9.
|
|
57
|
-
"inquirer": "^12.4.
|
|
58
|
+
"esbuild": "^0.25.1",
|
|
59
|
+
"eslint": "^9.22.0",
|
|
60
|
+
"inquirer": "^12.4.3",
|
|
58
61
|
"jest": "^29.7.0",
|
|
59
62
|
"jest-environment-jsdom": "^29.7.0",
|
|
60
63
|
"jest-ts-webcompat-resolver": "^1.0.0",
|
|
61
|
-
"
|
|
62
|
-
"rollup": "^4.34.8",
|
|
64
|
+
"rollup": "^4.35.0",
|
|
63
65
|
"rollup-plugin-dts": "^6.1.1",
|
|
64
|
-
"rollup-plugin-sourcemaps2": "^0.
|
|
66
|
+
"rollup-plugin-sourcemaps2": "^0.5.0",
|
|
65
67
|
"sharp": "^0.33.5",
|
|
66
68
|
"tar-stream": "^3.1.7",
|
|
67
|
-
"ts-jest": "^29.2.
|
|
69
|
+
"ts-jest": "^29.2.6",
|
|
68
70
|
"ts-node": "^10.9.2",
|
|
69
|
-
"tsx": "^4.19.
|
|
70
|
-
"
|
|
71
|
-
"
|
|
72
|
-
"typescript": "^5.7.3",
|
|
73
|
-
"typescript-eslint": "^8.24.0"
|
|
71
|
+
"tsx": "^4.19.3",
|
|
72
|
+
"typescript": "^5.8.2",
|
|
73
|
+
"typescript-eslint": "^8.26.1"
|
|
74
74
|
}
|
|
75
75
|
}
|