@tileflow/vue 0.1.0-alpha.29 → 0.1.0-alpha.31
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 +12 -6
- package/dist/index.js +17 -11
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -100,16 +100,22 @@ map's themes instead of `theme`: position 0 is the first theme and 1.5 is halfwa
|
|
|
100
100
|
the third. Moving the position updates the map at once. See
|
|
101
101
|
[theme transitions and blends](https://github.com/tileflow/tileflow-sdk/blob/main/packages/core/docs/theme-transitions-and-blends.md).
|
|
102
102
|
|
|
103
|
-
Interactive maps
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
103
|
+
Interactive maps show the 3D scene their style declares by default: buildings with Tileflow
|
|
104
|
+
landmarks and the map's Team building models, 3D trees, and street lights where the map enables
|
|
105
|
+
them. The 3D renderers load only when the style declares a scene, so 2D maps do not download them.
|
|
106
|
+
`viewMode` is `3d` by default; `view-mode="2d"` opts out, mounting no 3D buildings or street lights, and
|
|
107
|
+
draws vegetation as the map's policy sets for the 2D view (Streets keeps its model trees in either
|
|
108
|
+
view). `vegetation` overrides vegetation visibility (omitting it uses the map default); `:vegetation="false"`
|
|
109
|
+
hides models and flat artwork alike. Changing either prop updates the existing map immediately.
|
|
110
|
+
They do not change camera pitch and do not apply in image mode. See
|
|
111
|
+
[the map's 3D scene](https://github.com/tileflow/tileflow-sdk/blob/main/packages/core/docs/buildings-3d.md#the-maps-3d-scene)
|
|
112
|
+
and [vegetation controls](https://github.com/tileflow/tileflow-sdk/blob/main/packages/core/docs/trees-3d.md#visibility-and-representation).
|
|
109
113
|
|
|
110
114
|
`mapOptions` accepts native MapLibre options except `container` and `style`. Direct props take
|
|
111
115
|
priority over those options, then the published view, then shared defaults. `TileflowMap` always
|
|
112
116
|
selects a Tileflow map through its manifest; it has no renderer discriminator or direct-style mode.
|
|
117
|
+
Tileflow's styles are validated when they are compiled, so `validateStyle` defaults to `false`; pass
|
|
118
|
+
`true` to validate them again in the browser.
|
|
113
119
|
The obsolete source fields `kind` and `style` are rejected. For a completely unmanaged map, use
|
|
114
120
|
`maplibre-gl` directly rather than a Tileflow component.
|
|
115
121
|
|
package/dist/index.js
CHANGED
|
@@ -16,10 +16,11 @@ import {
|
|
|
16
16
|
import {
|
|
17
17
|
attachTileflowAtmosphere,
|
|
18
18
|
attachTileflowFairUseNotice,
|
|
19
|
+
attachTileflowMap3D,
|
|
19
20
|
attachTileflowMapLifecycle,
|
|
21
|
+
attachTileflowNotices,
|
|
20
22
|
createTileflowSessionStarter,
|
|
21
23
|
createTileflowThemeController,
|
|
22
|
-
createTileflowVegetation,
|
|
23
24
|
createTileflowTransformRequest,
|
|
24
25
|
getTileflowSystemColorScheme,
|
|
25
26
|
loadTileflowStyleFonts,
|
|
@@ -244,7 +245,7 @@ var TileflowMap = defineComponent({
|
|
|
244
245
|
type: Object
|
|
245
246
|
},
|
|
246
247
|
vegetation: { type: Boolean, default: void 0 },
|
|
247
|
-
viewMode: { type: String, default: "
|
|
248
|
+
viewMode: { type: String, default: "3d" },
|
|
248
249
|
theme: String,
|
|
249
250
|
timeOfDay: String,
|
|
250
251
|
themeBlend: Object,
|
|
@@ -296,7 +297,7 @@ var TileflowMap = defineComponent({
|
|
|
296
297
|
let mapLifecycle = null;
|
|
297
298
|
let mapResizeObserver = null;
|
|
298
299
|
let mapWorldRequestBridge = null;
|
|
299
|
-
let
|
|
300
|
+
let sceneAttachment = null;
|
|
300
301
|
let themeController = null;
|
|
301
302
|
let unsubscribeSystemColorScheme = null;
|
|
302
303
|
let mapLoadId = 0;
|
|
@@ -630,8 +631,8 @@ var TileflowMap = defineComponent({
|
|
|
630
631
|
watch(
|
|
631
632
|
() => [props.vegetation, props.viewMode],
|
|
632
633
|
([visible, viewMode]) => {
|
|
633
|
-
|
|
634
|
-
|
|
634
|
+
sceneAttachment?.setVegetation(visible);
|
|
635
|
+
sceneAttachment?.setViewMode(viewMode ?? "3d");
|
|
635
636
|
}
|
|
636
637
|
);
|
|
637
638
|
const destroyMap = () => {
|
|
@@ -643,8 +644,8 @@ var TileflowMap = defineComponent({
|
|
|
643
644
|
const resizeObserver = mapResizeObserver;
|
|
644
645
|
const map = mapRef.value;
|
|
645
646
|
const controller = themeController;
|
|
646
|
-
const
|
|
647
|
-
|
|
647
|
+
const scene = sceneAttachment;
|
|
648
|
+
sceneAttachment = null;
|
|
648
649
|
const annotationInteractionsForMap = annotationRuntime;
|
|
649
650
|
const semanticInteractionsForMap = semanticRuntime;
|
|
650
651
|
const worldRequestBridge = mapWorldRequestBridge;
|
|
@@ -662,7 +663,7 @@ var TileflowMap = defineComponent({
|
|
|
662
663
|
() => worldRequestBridge?.dispose(),
|
|
663
664
|
() => fairUseNotice?.dispose(),
|
|
664
665
|
() => lifecycle?.dispose(),
|
|
665
|
-
() =>
|
|
666
|
+
() => scene?.dispose(),
|
|
666
667
|
() => controller?.dispose(),
|
|
667
668
|
() => resizeObserver?.disconnect(),
|
|
668
669
|
() => map?.remove()
|
|
@@ -796,6 +797,8 @@ var TileflowMap = defineComponent({
|
|
|
796
797
|
attributionControl: props.mapOptions?.attributionControl ?? {
|
|
797
798
|
compact: true
|
|
798
799
|
},
|
|
800
|
+
// Tileflow's compiled styles are validated when they are built.
|
|
801
|
+
validateStyle: props.mapOptions?.validateStyle ?? false,
|
|
799
802
|
bearing: resolvedBearing.value,
|
|
800
803
|
center: resolvedCenter.value,
|
|
801
804
|
container,
|
|
@@ -813,6 +816,7 @@ var TileflowMap = defineComponent({
|
|
|
813
816
|
});
|
|
814
817
|
mapRef.value = map;
|
|
815
818
|
attachTileflowAtmosphere(map);
|
|
819
|
+
attachTileflowNotices(map);
|
|
816
820
|
themeController = runtime.theme === void 0 ? null : createTileflowThemeController({
|
|
817
821
|
initial: runtime,
|
|
818
822
|
map,
|
|
@@ -827,11 +831,13 @@ var TileflowMap = defineComponent({
|
|
|
827
831
|
}
|
|
828
832
|
}
|
|
829
833
|
});
|
|
830
|
-
|
|
834
|
+
sceneAttachment = attachTileflowMap3D({
|
|
831
835
|
map,
|
|
832
836
|
...themeController ? { controller: themeController } : {},
|
|
833
|
-
|
|
834
|
-
viewMode: props.viewMode ?? "
|
|
837
|
+
vegetation: props.vegetation,
|
|
838
|
+
viewMode: props.viewMode ?? "3d",
|
|
839
|
+
load: () => import("@tileflow/core/3d"),
|
|
840
|
+
onError: (error) => console.error("Failed to load the Tileflow 3D scene", error),
|
|
835
841
|
transformRequest: createTileflowTransformRequest({
|
|
836
842
|
getAnalytics: () => resolvedAnalytics.value,
|
|
837
843
|
sessionController: session,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tileflow/vue",
|
|
3
|
-
"version": "0.1.0-alpha.
|
|
3
|
+
"version": "0.1.0-alpha.31",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"description": "Vue component for rendering Tileflow maps with MapLibre.",
|
|
6
6
|
"type": "module",
|
|
@@ -38,8 +38,8 @@
|
|
|
38
38
|
"access": "public"
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
|
-
"@tileflow/core": ">=0.1.0-alpha.
|
|
42
|
-
"@tileflow/interactions": ">=0.1.0-alpha.
|
|
41
|
+
"@tileflow/core": ">=0.1.0-alpha.38 <0.1.0-beta.0",
|
|
42
|
+
"@tileflow/interactions": ">=0.1.0-alpha.6 <0.1.0-beta.0"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"maplibre-gl": ">=6.4.1 <7",
|