venue-js 1.2.0-next.6 → 1.2.0-next.8
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/index.d.mts +162 -13
- package/dist/index.d.ts +162 -13
- package/dist/index.js +417 -597
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +410 -595
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,3 +1,9 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __export = (target, all) => {
|
|
3
|
+
for (var name in all)
|
|
4
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
5
|
+
};
|
|
6
|
+
|
|
1
7
|
// src/data/index.ts
|
|
2
8
|
import { QueryObserver as QueryObserver2 } from "@tanstack/query-core";
|
|
3
9
|
|
|
@@ -191,6 +197,115 @@ var safeFetchFeature = async (featureType, params) => {
|
|
|
191
197
|
}
|
|
192
198
|
};
|
|
193
199
|
|
|
200
|
+
// src/data/utils/geometry-validator.ts
|
|
201
|
+
var isValidCoordinate = (point2) => {
|
|
202
|
+
return point2.length === 2 && point2.every((coord) => typeof coord === "number");
|
|
203
|
+
};
|
|
204
|
+
function isValidLinearRingCoordinates(ring) {
|
|
205
|
+
if (ring.length < 4) {
|
|
206
|
+
return false;
|
|
207
|
+
}
|
|
208
|
+
return ring.every(isValidCoordinate) && ring[0][0] === ring[ring.length - 1][0] && ring[0][1] === ring[ring.length - 1][1];
|
|
209
|
+
}
|
|
210
|
+
var isValidPolygonCoordinates = (polygon) => {
|
|
211
|
+
if (Array.isArray(polygon[0]) && (polygon[0].length === 0 || typeof polygon[0][0] === "number")) {
|
|
212
|
+
return isValidLinearRingCoordinates(polygon);
|
|
213
|
+
}
|
|
214
|
+
if (Array.isArray(polygon) && polygon.length > 0 && Array.isArray(polygon[0])) {
|
|
215
|
+
if (!isValidLinearRingCoordinates(polygon[0])) {
|
|
216
|
+
return false;
|
|
217
|
+
}
|
|
218
|
+
for (let i = 1; i < polygon.length; i++) {
|
|
219
|
+
if (!isValidLinearRingCoordinates(polygon[i])) {
|
|
220
|
+
return false;
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
return true;
|
|
224
|
+
}
|
|
225
|
+
return false;
|
|
226
|
+
};
|
|
227
|
+
var isValidMultiPolygonCoordinates = (multipolygon) => {
|
|
228
|
+
return multipolygon.every(isValidPolygonCoordinates);
|
|
229
|
+
};
|
|
230
|
+
var isValidLineStringCoordinates = (lineString2) => {
|
|
231
|
+
if (!Array.isArray(lineString2) || lineString2.length < 2) {
|
|
232
|
+
return false;
|
|
233
|
+
}
|
|
234
|
+
const firstPoint = lineString2[0];
|
|
235
|
+
const lastPoint = lineString2[lineString2.length - 1];
|
|
236
|
+
if (firstPoint[0] === lastPoint[0] && firstPoint[1] === lastPoint[1]) {
|
|
237
|
+
return false;
|
|
238
|
+
}
|
|
239
|
+
return lineString2.every(isValidCoordinate);
|
|
240
|
+
};
|
|
241
|
+
var isValidMultiPolygon = (geometry) => {
|
|
242
|
+
const { type, coordinates } = geometry;
|
|
243
|
+
return type === "MultiPolygon" && isValidMultiPolygonCoordinates(coordinates);
|
|
244
|
+
};
|
|
245
|
+
var isValidPolygon = (geometry) => {
|
|
246
|
+
const { type, coordinates } = geometry;
|
|
247
|
+
return type === "Polygon" && isValidPolygonCoordinates(coordinates);
|
|
248
|
+
};
|
|
249
|
+
var isValidLineString = (geometry) => {
|
|
250
|
+
const { type, coordinates } = geometry;
|
|
251
|
+
return type === "LineString" && isValidLineStringCoordinates(coordinates);
|
|
252
|
+
};
|
|
253
|
+
var isValidPoint = (geometry) => {
|
|
254
|
+
const { type, coordinates } = geometry;
|
|
255
|
+
return type === "Point" && isValidCoordinate(coordinates);
|
|
256
|
+
};
|
|
257
|
+
|
|
258
|
+
// src/data/utils/match-filters.ts
|
|
259
|
+
function isInFilter(filter) {
|
|
260
|
+
return typeof filter === "object" && filter !== null && "$in" in filter && Array.isArray(filter.$in);
|
|
261
|
+
}
|
|
262
|
+
var someIntersect = (a, b) => a.some((v) => b.includes(v));
|
|
263
|
+
function matchFilter(value, filter) {
|
|
264
|
+
if (Array.isArray(value)) {
|
|
265
|
+
if (isInFilter(filter)) return someIntersect(value, filter.$in);
|
|
266
|
+
return value.includes(filter);
|
|
267
|
+
} else {
|
|
268
|
+
if (isInFilter(filter)) return filter.$in.includes(value);
|
|
269
|
+
return value === filter;
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
function matchFilters(item, filters) {
|
|
273
|
+
return Object.entries(filters).every(([key, filter]) => {
|
|
274
|
+
return matchFilter(item.properties[key], filter);
|
|
275
|
+
});
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
// src/data/utils/occupant-helper.ts
|
|
279
|
+
var occupant_helper_exports = {};
|
|
280
|
+
__export(occupant_helper_exports, {
|
|
281
|
+
getOccupantCorrelatedLocations: () => getOccupantCorrelatedLocations,
|
|
282
|
+
getOccupantMainLocation: () => getOccupantMainLocation,
|
|
283
|
+
getOccupantMarkerLocations: () => getOccupantMarkerLocations
|
|
284
|
+
});
|
|
285
|
+
import _compact from "lodash/compact";
|
|
286
|
+
var getOccupantMainLocation = (occupant) => {
|
|
287
|
+
return occupant.properties.kiosk || occupant.properties.unit;
|
|
288
|
+
};
|
|
289
|
+
var getOccupantCorrelatedLocations = (occupant) => {
|
|
290
|
+
const allCorrelatedLocations = [
|
|
291
|
+
...occupant.properties.units,
|
|
292
|
+
...occupant.properties.kiosks
|
|
293
|
+
];
|
|
294
|
+
return _compact(allCorrelatedLocations);
|
|
295
|
+
};
|
|
296
|
+
var getOccupantMarkerLocations = (occupant, options) => {
|
|
297
|
+
const placementType = options?.type ? options.type : occupant.properties.show_name_on_all_units ? "ALL_LOCATIONS" : "ONCE_PER_LEVEL";
|
|
298
|
+
const mainLocation = getOccupantMainLocation(occupant);
|
|
299
|
+
const mainLocationLevel = mainLocation?.properties?.level_id;
|
|
300
|
+
const allCorrelatedLocations = getOccupantCorrelatedLocations(occupant);
|
|
301
|
+
if (placementType === "ALL_LOCATIONS") {
|
|
302
|
+
return _compact([mainLocation, ...allCorrelatedLocations]);
|
|
303
|
+
}
|
|
304
|
+
const otherLevelLocations = allCorrelatedLocations.filter((f) => f.properties.level_id !== mainLocationLevel);
|
|
305
|
+
const onePerLevelLocations = [...new Map(otherLevelLocations.map((loc) => [loc.properties.level_id, loc])).values()];
|
|
306
|
+
return _compact([mainLocation, ...onePerLevelLocations]);
|
|
307
|
+
};
|
|
308
|
+
|
|
194
309
|
// src/data/getDataClient.ts
|
|
195
310
|
import {
|
|
196
311
|
QueryClient,
|
|
@@ -349,8 +464,8 @@ var createPopulator = ({
|
|
|
349
464
|
venue,
|
|
350
465
|
promotions,
|
|
351
466
|
privileges,
|
|
352
|
-
kiosk,
|
|
353
|
-
unit,
|
|
467
|
+
kiosk: kiosk ? await populateKiosk(kiosk) : null,
|
|
468
|
+
unit: unit ? await populateUnit(unit) : null,
|
|
354
469
|
kiosks: await Promise.all(kiosks.map(populateKiosk)),
|
|
355
470
|
units: await Promise.all(units.map(populateUnit))
|
|
356
471
|
}
|
|
@@ -442,26 +557,6 @@ var createPopulator = ({
|
|
|
442
557
|
};
|
|
443
558
|
};
|
|
444
559
|
|
|
445
|
-
// src/data/utils/match-filters.ts
|
|
446
|
-
function isInFilter(filter) {
|
|
447
|
-
return typeof filter === "object" && filter !== null && "$in" in filter && Array.isArray(filter.$in);
|
|
448
|
-
}
|
|
449
|
-
var someIntersect = (a, b) => a.some((v) => b.includes(v));
|
|
450
|
-
function matchFilter(value, filter) {
|
|
451
|
-
if (Array.isArray(value)) {
|
|
452
|
-
if (isInFilter(filter)) return someIntersect(value, filter.$in);
|
|
453
|
-
return value.includes(filter);
|
|
454
|
-
} else {
|
|
455
|
-
if (isInFilter(filter)) return filter.$in.includes(value);
|
|
456
|
-
return value === filter;
|
|
457
|
-
}
|
|
458
|
-
}
|
|
459
|
-
function matchFilters(item, filters) {
|
|
460
|
-
return Object.entries(filters).every(([key, filter]) => {
|
|
461
|
-
return matchFilter(item.properties[key], filter);
|
|
462
|
-
});
|
|
463
|
-
}
|
|
464
|
-
|
|
465
560
|
// src/data/getDataClient.ts
|
|
466
561
|
var getDataClient = (options) => {
|
|
467
562
|
const observers = /* @__PURE__ */ new Map();
|
|
@@ -1704,18 +1799,6 @@ var loadModel3d = (model3d, coordinate, threeLayer) => {
|
|
|
1704
1799
|
);
|
|
1705
1800
|
});
|
|
1706
1801
|
};
|
|
1707
|
-
var create3DModels = async (models, defaultCoordinate, properties, threeLayer) => {
|
|
1708
|
-
let modelObjs = [];
|
|
1709
|
-
for (let j = 0; j < models.length; j++) {
|
|
1710
|
-
const model = models[j];
|
|
1711
|
-
const positionCoord = _4.get(model, "properties.position");
|
|
1712
|
-
const coord = positionCoord || defaultCoordinate;
|
|
1713
|
-
const object = await loadModel3d(model, coord, threeLayer);
|
|
1714
|
-
object.properties = properties;
|
|
1715
|
-
modelObjs.push(object);
|
|
1716
|
-
}
|
|
1717
|
-
return modelObjs;
|
|
1718
|
-
};
|
|
1719
1802
|
var createExtrudePolygon = (geometry, threeLayer, material, height, properties = {}, options) => {
|
|
1720
1803
|
const { offset = 0, altitude = 0 } = options;
|
|
1721
1804
|
const offsetGeometry = turfBuffer(geometry, offset, { units: "meters" });
|
|
@@ -2623,44 +2706,6 @@ var styledFeatureGenerator = (mapTheme) => {
|
|
|
2623
2706
|
markerProperties
|
|
2624
2707
|
);
|
|
2625
2708
|
},
|
|
2626
|
-
createVenue3DModel: async (venue, threeLayer) => {
|
|
2627
|
-
const { id, feature_type, properties } = venue;
|
|
2628
|
-
const { category, model3d } = properties;
|
|
2629
|
-
const modelProperty = {
|
|
2630
|
-
id,
|
|
2631
|
-
feature_type,
|
|
2632
|
-
category
|
|
2633
|
-
};
|
|
2634
|
-
const center2 = turfCenter(venue);
|
|
2635
|
-
const centerCoord = _4.get(center2, "geometry.coordinates");
|
|
2636
|
-
const modelPosition = _4.get(model3d, "properties.position", centerCoord);
|
|
2637
|
-
const models = await create3DModels(
|
|
2638
|
-
model3d,
|
|
2639
|
-
modelPosition,
|
|
2640
|
-
modelProperty,
|
|
2641
|
-
threeLayer
|
|
2642
|
-
);
|
|
2643
|
-
return models;
|
|
2644
|
-
},
|
|
2645
|
-
create3DFixture: async (fixture, threeLayer) => {
|
|
2646
|
-
const { id, feature_type, properties } = fixture;
|
|
2647
|
-
const { category, ordinal, model3d } = properties;
|
|
2648
|
-
const modelProperty = {
|
|
2649
|
-
id,
|
|
2650
|
-
feature_type,
|
|
2651
|
-
category,
|
|
2652
|
-
ordinal
|
|
2653
|
-
};
|
|
2654
|
-
const center2 = turfCenter(fixture);
|
|
2655
|
-
const coordinate = _4.get(center2, "geometry.coordinates");
|
|
2656
|
-
const models = await create3DModels(
|
|
2657
|
-
model3d,
|
|
2658
|
-
coordinate,
|
|
2659
|
-
modelProperty,
|
|
2660
|
-
threeLayer
|
|
2661
|
-
);
|
|
2662
|
-
return models;
|
|
2663
|
-
},
|
|
2664
2709
|
createExtrudedUnit: (unit, threeLayer, options) => {
|
|
2665
2710
|
const extrudeHeight = _4.get(options, "height");
|
|
2666
2711
|
if (!extrudeHeight) return;
|
|
@@ -2700,24 +2745,6 @@ var styledFeatureGenerator = (mapTheme) => {
|
|
|
2700
2745
|
options3d
|
|
2701
2746
|
);
|
|
2702
2747
|
return object;
|
|
2703
|
-
},
|
|
2704
|
-
createAmbientLight: (config) => {
|
|
2705
|
-
const { color: colorString = "0xffffff", intensity = 1 } = config;
|
|
2706
|
-
const color = parseInt(colorString, 16);
|
|
2707
|
-
const ambientLight = new AmbientLight(color, intensity);
|
|
2708
|
-
return ambientLight;
|
|
2709
|
-
},
|
|
2710
|
-
createDirectionalLight: (config) => {
|
|
2711
|
-
const {
|
|
2712
|
-
color: colorString = "0xffffff",
|
|
2713
|
-
intensity = 1,
|
|
2714
|
-
position: positionString = [0, 0, 0]
|
|
2715
|
-
} = config;
|
|
2716
|
-
const color = parseInt(colorString, 16);
|
|
2717
|
-
const [x, y, z] = positionString;
|
|
2718
|
-
const light = new DirectionalLight(color, intensity);
|
|
2719
|
-
light.position.set(x, y, z).normalize();
|
|
2720
|
-
return light;
|
|
2721
2748
|
}
|
|
2722
2749
|
};
|
|
2723
2750
|
};
|
|
@@ -3082,7 +3109,7 @@ import * as THREE3 from "three";
|
|
|
3082
3109
|
|
|
3083
3110
|
// src/IndoorMap/renderer/3d/Element3DRenderer.ts
|
|
3084
3111
|
import * as maptalks4 from "maptalks-gl";
|
|
3085
|
-
import * as
|
|
3112
|
+
import * as THREE from "three";
|
|
3086
3113
|
import turfBuffer2 from "@turf/buffer";
|
|
3087
3114
|
|
|
3088
3115
|
// src/IndoorMap/renderer/3d/element3DRendererOptions.ts
|
|
@@ -3095,6 +3122,7 @@ var element3DRendererOptions = {
|
|
|
3095
3122
|
unenclosedarea: { color: "#cccccc", height: 0.2 },
|
|
3096
3123
|
nonpublic: { color: "#999999", height: 0.3 },
|
|
3097
3124
|
escalator: { height: 0.2 },
|
|
3125
|
+
parking: { height: 0.1 },
|
|
3098
3126
|
room: { color: "#ffffff", height: 2, bottomHeight: 0.12 }
|
|
3099
3127
|
}
|
|
3100
3128
|
},
|
|
@@ -3110,259 +3138,61 @@ var element3DRendererOptions = {
|
|
|
3110
3138
|
}
|
|
3111
3139
|
};
|
|
3112
3140
|
|
|
3113
|
-
// src/IndoorMap/renderer/3d/
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
// src/IndoorMap/renderer/utils/interpolateStops.ts
|
|
3120
|
-
var interpolateStops = ({ stops }, zoom) => {
|
|
3121
|
-
if (zoom <= stops[0][0]) return stops[0][1];
|
|
3122
|
-
if (zoom >= stops[stops.length - 1][0]) return stops[stops.length - 1][1];
|
|
3123
|
-
for (let i = 0; i < stops.length - 1; i++) {
|
|
3124
|
-
const [z1, v1] = stops[i];
|
|
3125
|
-
const [z2, v2] = stops[i + 1];
|
|
3126
|
-
if (zoom >= z1 && zoom <= z2) {
|
|
3127
|
-
const t = (zoom - z1) / (z2 - z1);
|
|
3128
|
-
return v1 + t * (v2 - v1);
|
|
3129
|
-
}
|
|
3130
|
-
}
|
|
3141
|
+
// src/IndoorMap/renderer/3d/Element3DRenderer.ts
|
|
3142
|
+
var DEFAULT_POLYGON_OPTION = {
|
|
3143
|
+
color: "#FFFFFF",
|
|
3144
|
+
offset: 0,
|
|
3145
|
+
altitude: 0
|
|
3131
3146
|
};
|
|
3132
|
-
|
|
3133
|
-
|
|
3134
|
-
var
|
|
3135
|
-
|
|
3136
|
-
|
|
3137
|
-
|
|
3138
|
-
|
|
3139
|
-
|
|
3140
|
-
|
|
3141
|
-
|
|
3142
|
-
background: "rgba(0, 0, 0, 0.2)",
|
|
3143
|
-
lineHeight: 32,
|
|
3144
|
-
padding: 8,
|
|
3145
|
-
strokeColor: "#000000",
|
|
3146
|
-
strokeWidth: 6,
|
|
3147
|
-
strokeStyle: "round",
|
|
3148
|
-
// Sprite options
|
|
3149
|
-
/* Overall scale multiplier */
|
|
3150
|
-
scale: 1,
|
|
3151
|
-
altitude: 0,
|
|
3152
|
-
opacity: 1
|
|
3147
|
+
var HEIGHT_METER = 4;
|
|
3148
|
+
var MULTIORDINAL_HEIGHT_METER = 9;
|
|
3149
|
+
var getGeometryOption = (feature2, options) => {
|
|
3150
|
+
try {
|
|
3151
|
+
const option = options[feature2.feature_type] ?? element3DRendererOptions[feature2.feature_type];
|
|
3152
|
+
const category = feature2.properties.category;
|
|
3153
|
+
return (category && option.byCategory?.[category]) ?? option?.default ?? DEFAULT_POLYGON_OPTION;
|
|
3154
|
+
} catch (err) {
|
|
3155
|
+
console.log(err.message, { options, feature: feature2 });
|
|
3156
|
+
}
|
|
3153
3157
|
};
|
|
3154
|
-
var
|
|
3155
|
-
|
|
3156
|
-
|
|
3157
|
-
|
|
3158
|
+
var Element3DRenderer = class extends EventTarget {
|
|
3159
|
+
options;
|
|
3160
|
+
map;
|
|
3161
|
+
gltfLayer;
|
|
3162
|
+
threeLayer;
|
|
3163
|
+
// private dracoLoader: DRACOLoader
|
|
3164
|
+
lineMaterial;
|
|
3165
|
+
materialByColorMap;
|
|
3166
|
+
// Renderer is Ready
|
|
3167
|
+
isReady = false;
|
|
3168
|
+
constructor(map, options) {
|
|
3158
3169
|
super();
|
|
3159
|
-
this.
|
|
3160
|
-
this.
|
|
3161
|
-
this.
|
|
3162
|
-
this.
|
|
3163
|
-
|
|
3164
|
-
this.
|
|
3165
|
-
this.
|
|
3166
|
-
this.type = "TextSpriteMarker";
|
|
3170
|
+
this.options = options;
|
|
3171
|
+
this.map = map;
|
|
3172
|
+
const groupLayer = this.map.getLayer("group");
|
|
3173
|
+
this.threeLayer = groupLayer.getLayer("three");
|
|
3174
|
+
this.gltfLayer = groupLayer.getLayer("gltf");
|
|
3175
|
+
this.lineMaterial = new THREE.LineBasicMaterial({ color: "#000" });
|
|
3176
|
+
this.render();
|
|
3167
3177
|
}
|
|
3168
|
-
|
|
3169
|
-
|
|
3178
|
+
animation() {
|
|
3179
|
+
this.threeLayer._needsUpdate = !this.threeLayer._needsUpdate;
|
|
3180
|
+
if (this.threeLayer._needsUpdate) {
|
|
3181
|
+
this.threeLayer.redraw();
|
|
3182
|
+
}
|
|
3183
|
+
requestAnimationFrame(this.animation);
|
|
3170
3184
|
}
|
|
3171
|
-
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
const
|
|
3175
|
-
|
|
3176
|
-
|
|
3177
|
-
|
|
3178
|
-
|
|
3179
|
-
|
|
3180
|
-
const w = texture.image.width;
|
|
3181
|
-
const h = texture.image.height;
|
|
3182
|
-
const base = 1 / 16;
|
|
3183
|
-
const normalizedScale = options.scale / this.getMap().getGLRes();
|
|
3184
|
-
sprite.scale.set(w * base * normalizedScale, h * base * normalizedScale, 1);
|
|
3185
|
-
this.#altitudeOffset = Math.max(
|
|
3186
|
-
h * base * options.scale * 0.5,
|
|
3187
|
-
0.05
|
|
3188
|
-
// minimum lift in world units
|
|
3189
|
-
);
|
|
3190
|
-
return sprite;
|
|
3185
|
+
/** Materials */
|
|
3186
|
+
getOrCreateMaterialByColor(color) {
|
|
3187
|
+
if (!this.materialByColorMap) this.materialByColorMap = /* @__PURE__ */ new Map();
|
|
3188
|
+
const existingMaterial = this.materialByColorMap.get(color);
|
|
3189
|
+
if (existingMaterial) return existingMaterial;
|
|
3190
|
+
const created = new THREE.MeshLambertMaterial({ color, transparent: true });
|
|
3191
|
+
created.toneMapped = false;
|
|
3192
|
+
this.materialByColorMap.set(color, created);
|
|
3193
|
+
return created;
|
|
3191
3194
|
}
|
|
3192
|
-
|
|
3193
|
-
const {
|
|
3194
|
-
padding,
|
|
3195
|
-
fontSize,
|
|
3196
|
-
fontFamily,
|
|
3197
|
-
fontWeight,
|
|
3198
|
-
lineHeight,
|
|
3199
|
-
background,
|
|
3200
|
-
color,
|
|
3201
|
-
textAlign,
|
|
3202
|
-
strokeColor,
|
|
3203
|
-
strokeWidth,
|
|
3204
|
-
maxWidth
|
|
3205
|
-
} = options || {};
|
|
3206
|
-
const canvas = document.createElement("canvas");
|
|
3207
|
-
const ctx = canvas.getContext("2d");
|
|
3208
|
-
ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
3209
|
-
const paragraphs = String(text).split("\n");
|
|
3210
|
-
const wrappedLines = [];
|
|
3211
|
-
paragraphs.forEach((paragraph) => {
|
|
3212
|
-
if (isNil(maxWidth) || isNaN(maxWidth)) {
|
|
3213
|
-
wrappedLines.push(paragraph);
|
|
3214
|
-
return;
|
|
3215
|
-
}
|
|
3216
|
-
const words = paragraph.split(/\s+/);
|
|
3217
|
-
let currentLine = "";
|
|
3218
|
-
words.forEach((word) => {
|
|
3219
|
-
const testLine = currentLine ? currentLine + " " + word : word;
|
|
3220
|
-
const testWidth = ctx.measureText(testLine).width;
|
|
3221
|
-
if (testWidth > maxWidth && currentLine) {
|
|
3222
|
-
wrappedLines.push(currentLine);
|
|
3223
|
-
currentLine = word;
|
|
3224
|
-
} else {
|
|
3225
|
-
currentLine = testLine;
|
|
3226
|
-
}
|
|
3227
|
-
});
|
|
3228
|
-
if (currentLine) {
|
|
3229
|
-
wrappedLines.push(currentLine);
|
|
3230
|
-
}
|
|
3231
|
-
});
|
|
3232
|
-
const lines = wrappedLines.length ? wrappedLines : [""];
|
|
3233
|
-
const widest = Math.max(...lines.map((l) => ctx.measureText(l).width), 0);
|
|
3234
|
-
const finalWidth = (maxWidth ? Math.min(widest, maxWidth) : widest) + padding * 2;
|
|
3235
|
-
const finalHeight = lineHeight * lines.length + padding * 2;
|
|
3236
|
-
canvas.width = finalWidth;
|
|
3237
|
-
canvas.height = finalHeight;
|
|
3238
|
-
const ctx2 = canvas.getContext("2d");
|
|
3239
|
-
ctx2.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
3240
|
-
ctx2.textAlign = textAlign;
|
|
3241
|
-
if (background && background !== "transparent") {
|
|
3242
|
-
ctx2.fillStyle = background;
|
|
3243
|
-
ctx2.fillRect(0, 0, canvas.width, canvas.height);
|
|
3244
|
-
}
|
|
3245
|
-
lines.forEach((line, i) => {
|
|
3246
|
-
const y = padding + lineHeight * (i + 0.8);
|
|
3247
|
-
let x = padding;
|
|
3248
|
-
if (textAlign === "center") x = canvas.width / 2;
|
|
3249
|
-
if (textAlign === "right" || textAlign === "end")
|
|
3250
|
-
x = canvas.width - padding;
|
|
3251
|
-
if (strokeWidth > 0) {
|
|
3252
|
-
ctx2.lineWidth = strokeWidth;
|
|
3253
|
-
ctx2.lineJoin = "round";
|
|
3254
|
-
ctx2.miterLimit = 2;
|
|
3255
|
-
ctx2.strokeStyle = strokeColor;
|
|
3256
|
-
ctx2.strokeText(line, x, y);
|
|
3257
|
-
}
|
|
3258
|
-
ctx2.fillStyle = color;
|
|
3259
|
-
ctx2.fillText(line, x, y);
|
|
3260
|
-
});
|
|
3261
|
-
const texture = new THREE.CanvasTexture(canvas);
|
|
3262
|
-
texture.needsUpdate = true;
|
|
3263
|
-
texture.minFilter = THREE.LinearFilter;
|
|
3264
|
-
return texture;
|
|
3265
|
-
}
|
|
3266
|
-
_updatePosition() {
|
|
3267
|
-
const options = this.getOptions();
|
|
3268
|
-
const layer = options.layer;
|
|
3269
|
-
if (!layer) return;
|
|
3270
|
-
const altitude = (options.altitude || 0) + this.#altitudeOffset;
|
|
3271
|
-
const z = layer.altitudeToVector3(altitude, altitude).x;
|
|
3272
|
-
const position = layer.coordinateToVector3(this._coordinate, z);
|
|
3273
|
-
set(this.properties, "default.position", position);
|
|
3274
|
-
this.getObject3d().position.copy(position);
|
|
3275
|
-
}
|
|
3276
|
-
_animation() {
|
|
3277
|
-
const layer = this.getLayer();
|
|
3278
|
-
if (!this.isAdd || !layer) return;
|
|
3279
|
-
if (this._visible === true) {
|
|
3280
|
-
const zoom = layer.map.getZoom();
|
|
3281
|
-
const object3d = this.getObject3d();
|
|
3282
|
-
const { opacity } = this.getOptions();
|
|
3283
|
-
let opacityValue;
|
|
3284
|
-
if (typeof opacity === "number") {
|
|
3285
|
-
opacityValue = opacity ?? 1;
|
|
3286
|
-
} else if (Array.isArray(opacity.stops)) {
|
|
3287
|
-
opacityValue = interpolateStops(opacity, zoom);
|
|
3288
|
-
} else {
|
|
3289
|
-
throw new Error(`Unknown opacity value ${opacity}`);
|
|
3290
|
-
}
|
|
3291
|
-
const visible = opacityValue > 0.5;
|
|
3292
|
-
object3d.visible = visible;
|
|
3293
|
-
}
|
|
3294
|
-
}
|
|
3295
|
-
setText(text) {
|
|
3296
|
-
const options = this.getOptions();
|
|
3297
|
-
options.text = text;
|
|
3298
|
-
const newSprite = this._createSprite();
|
|
3299
|
-
const group = this.getObject3d();
|
|
3300
|
-
group.children.forEach((child) => group.remove(child));
|
|
3301
|
-
group.add(newSprite);
|
|
3302
|
-
this._updatePosition();
|
|
3303
|
-
}
|
|
3304
|
-
setAltitude(altitude) {
|
|
3305
|
-
const bottomHeight = this.options.bottomHeight ?? 0;
|
|
3306
|
-
return super.setAltitude(altitude + bottomHeight + this.#altitudeOffset);
|
|
3307
|
-
}
|
|
3308
|
-
};
|
|
3309
|
-
|
|
3310
|
-
// src/IndoorMap/renderer/3d/Element3DRenderer.ts
|
|
3311
|
-
var DEFAULT_POLYGON_OPTION = {
|
|
3312
|
-
color: "#FFFFFF",
|
|
3313
|
-
offset: 0,
|
|
3314
|
-
altitude: 0
|
|
3315
|
-
};
|
|
3316
|
-
var HEIGHT_METER = 4;
|
|
3317
|
-
var MULTIORDINAL_HEIGHT_METER = 9;
|
|
3318
|
-
var getGeometryOption = (feature2, options) => {
|
|
3319
|
-
try {
|
|
3320
|
-
const option = options[feature2.feature_type] ?? element3DRendererOptions[feature2.feature_type];
|
|
3321
|
-
const category = feature2.properties.category;
|
|
3322
|
-
return (category && option.byCategory?.[category]) ?? option?.default ?? DEFAULT_POLYGON_OPTION;
|
|
3323
|
-
} catch (err) {
|
|
3324
|
-
console.log(err.message, { options, feature: feature2 });
|
|
3325
|
-
}
|
|
3326
|
-
};
|
|
3327
|
-
var Element3DRenderer = class extends EventTarget {
|
|
3328
|
-
options;
|
|
3329
|
-
map;
|
|
3330
|
-
gltfLayer;
|
|
3331
|
-
threeLayer;
|
|
3332
|
-
// private dracoLoader: DRACOLoader
|
|
3333
|
-
lineMaterial;
|
|
3334
|
-
materialByColorMap;
|
|
3335
|
-
markerRenderer;
|
|
3336
|
-
// Renderer is Ready
|
|
3337
|
-
isReady = false;
|
|
3338
|
-
constructor(map, options) {
|
|
3339
|
-
super();
|
|
3340
|
-
this.options = options;
|
|
3341
|
-
this.map = map;
|
|
3342
|
-
const groupLayer = this.map.getLayer("group");
|
|
3343
|
-
this.threeLayer = groupLayer.getLayer("three");
|
|
3344
|
-
this.gltfLayer = groupLayer.getLayer("gltf");
|
|
3345
|
-
this.lineMaterial = new THREE2.LineBasicMaterial({ color: "#000" });
|
|
3346
|
-
this.render();
|
|
3347
|
-
}
|
|
3348
|
-
animation() {
|
|
3349
|
-
this.threeLayer._needsUpdate = !this.threeLayer._needsUpdate;
|
|
3350
|
-
if (this.threeLayer._needsUpdate) {
|
|
3351
|
-
this.threeLayer.redraw();
|
|
3352
|
-
}
|
|
3353
|
-
requestAnimationFrame(this.animation);
|
|
3354
|
-
}
|
|
3355
|
-
/** Materials */
|
|
3356
|
-
getOrCreateMaterialByColor(color) {
|
|
3357
|
-
if (!this.materialByColorMap) this.materialByColorMap = /* @__PURE__ */ new Map();
|
|
3358
|
-
const existingMaterial = this.materialByColorMap.get(color);
|
|
3359
|
-
if (existingMaterial) return existingMaterial;
|
|
3360
|
-
const created = new THREE2.MeshLambertMaterial({ color, transparent: true });
|
|
3361
|
-
created.toneMapped = false;
|
|
3362
|
-
this.materialByColorMap.set(color, created);
|
|
3363
|
-
return created;
|
|
3364
|
-
}
|
|
3365
|
-
createGeometry = (feature2) => {
|
|
3195
|
+
createGeometry = (feature2) => {
|
|
3366
3196
|
const {
|
|
3367
3197
|
offset = 0,
|
|
3368
3198
|
height: heightOptions,
|
|
@@ -3482,19 +3312,6 @@ var Element3DRenderer = class extends EventTarget {
|
|
|
3482
3312
|
}
|
|
3483
3313
|
});
|
|
3484
3314
|
}
|
|
3485
|
-
createMarker = (coordinates, ordinal, text) => {
|
|
3486
|
-
const options = {
|
|
3487
|
-
// scale: 0.05,
|
|
3488
|
-
// altitude: ordinal * HEIGHT_METER,
|
|
3489
|
-
text
|
|
3490
|
-
// interactive: true,
|
|
3491
|
-
};
|
|
3492
|
-
const marker = new TextSpriteMarker(coordinates, options, this.threeLayer);
|
|
3493
|
-
this.threeLayer.addMesh([marker]);
|
|
3494
|
-
return marker;
|
|
3495
|
-
};
|
|
3496
|
-
removeMarker = () => {
|
|
3497
|
-
};
|
|
3498
3315
|
render() {
|
|
3499
3316
|
this.threeLayer._needsUpdate = !this.threeLayer._needsUpdate;
|
|
3500
3317
|
if (this.threeLayer._needsUpdate) {
|
|
@@ -3632,6 +3449,7 @@ var Marker2DRenderer = class extends EventTarget {
|
|
|
3632
3449
|
markerLayer;
|
|
3633
3450
|
constructor(map) {
|
|
3634
3451
|
super();
|
|
3452
|
+
this.map = map;
|
|
3635
3453
|
}
|
|
3636
3454
|
createMarker = (coordinates, ordinal, content) => {
|
|
3637
3455
|
const marker = new maptalks6.ui.UIMarker(coordinates, {
|
|
@@ -3653,73 +3471,203 @@ var Marker2DRenderer = class extends EventTarget {
|
|
|
3653
3471
|
};
|
|
3654
3472
|
|
|
3655
3473
|
// src/IndoorMap/renderer/3d/Marker3DRenderer.ts
|
|
3656
|
-
import * as maptalks7 from "maptalks";
|
|
3474
|
+
import * as maptalks7 from "maptalks-gl";
|
|
3657
3475
|
|
|
3658
|
-
// src/IndoorMap/renderer/
|
|
3659
|
-
import {
|
|
3660
|
-
|
|
3661
|
-
|
|
3662
|
-
|
|
3663
|
-
|
|
3664
|
-
|
|
3665
|
-
|
|
3666
|
-
|
|
3667
|
-
|
|
3668
|
-
|
|
3669
|
-
|
|
3670
|
-
|
|
3671
|
-
|
|
3672
|
-
|
|
3673
|
-
|
|
3674
|
-
|
|
3675
|
-
|
|
3676
|
-
img.onerror = function(error) {
|
|
3677
|
-
reject(error);
|
|
3678
|
-
};
|
|
3679
|
-
img.src = url;
|
|
3680
|
-
});
|
|
3476
|
+
// src/IndoorMap/renderer/3d/objects/TextSpriteMarker.ts
|
|
3477
|
+
import { Coordinate as Coordinate2, Util as Util4 } from "maptalks";
|
|
3478
|
+
import * as THREE2 from "three";
|
|
3479
|
+
import { BaseObject as BaseObject5 } from "maptalks.three";
|
|
3480
|
+
import { isNil, set } from "lodash";
|
|
3481
|
+
|
|
3482
|
+
// src/IndoorMap/renderer/utils/interpolateStops.ts
|
|
3483
|
+
var interpolateStops = ({ stops }, zoom) => {
|
|
3484
|
+
if (zoom <= stops[0][0]) return stops[0][1];
|
|
3485
|
+
if (zoom >= stops[stops.length - 1][0]) return stops[stops.length - 1][1];
|
|
3486
|
+
for (let i = 0; i < stops.length - 1; i++) {
|
|
3487
|
+
const [z1, v1] = stops[i];
|
|
3488
|
+
const [z2, v2] = stops[i + 1];
|
|
3489
|
+
if (zoom >= z1 && zoom <= z2) {
|
|
3490
|
+
const t = (zoom - z1) / (z2 - z1);
|
|
3491
|
+
return v1 + t * (v2 - v1);
|
|
3492
|
+
}
|
|
3493
|
+
}
|
|
3681
3494
|
};
|
|
3682
|
-
|
|
3683
|
-
|
|
3684
|
-
|
|
3685
|
-
|
|
3686
|
-
|
|
3687
|
-
|
|
3688
|
-
|
|
3689
|
-
|
|
3690
|
-
|
|
3691
|
-
|
|
3692
|
-
|
|
3693
|
-
|
|
3694
|
-
|
|
3695
|
-
|
|
3696
|
-
|
|
3495
|
+
|
|
3496
|
+
// src/IndoorMap/renderer/3d/objects/TextSpriteMarker.ts
|
|
3497
|
+
var OPTIONS4 = {
|
|
3498
|
+
// Texture options
|
|
3499
|
+
text: "",
|
|
3500
|
+
textAlign: "center",
|
|
3501
|
+
color: "#ffffff",
|
|
3502
|
+
fontFamily: "sans-serif",
|
|
3503
|
+
fontSize: 28,
|
|
3504
|
+
fontWeight: 400,
|
|
3505
|
+
background: "transparent",
|
|
3506
|
+
lineHeight: 32,
|
|
3507
|
+
padding: 8,
|
|
3508
|
+
strokeColor: "#000000",
|
|
3509
|
+
strokeWidth: 3,
|
|
3510
|
+
strokeStyle: "round",
|
|
3511
|
+
// Sprite options
|
|
3512
|
+
/* Overall scale multiplier */
|
|
3513
|
+
scale: 1,
|
|
3514
|
+
altitude: 0,
|
|
3515
|
+
opacity: 1
|
|
3516
|
+
};
|
|
3517
|
+
var TextSpriteMarker = class extends BaseObject5 {
|
|
3518
|
+
#altitudeOffset = 0;
|
|
3519
|
+
constructor(coordinate, options, layer, properties = {}) {
|
|
3520
|
+
options = Util4.extend({}, OPTIONS4, options, { layer });
|
|
3521
|
+
super();
|
|
3522
|
+
this._coordinate = new Coordinate2(coordinate);
|
|
3523
|
+
this._initOptions(options);
|
|
3524
|
+
this._createGroup();
|
|
3525
|
+
this.properties = { ...properties };
|
|
3526
|
+
const sprite = this._createSprite();
|
|
3527
|
+
this.getObject3d().add(sprite);
|
|
3528
|
+
this._updatePosition();
|
|
3529
|
+
this.type = "TextSpriteMarker";
|
|
3530
|
+
}
|
|
3531
|
+
getOptions() {
|
|
3532
|
+
return super.getOptions();
|
|
3533
|
+
}
|
|
3534
|
+
_createSprite() {
|
|
3535
|
+
const options = this.getOptions();
|
|
3536
|
+
const texture = this._createTextTexture(options.text, options);
|
|
3537
|
+
const material = new THREE2.SpriteMaterial({
|
|
3538
|
+
map: texture,
|
|
3539
|
+
transparent: true,
|
|
3540
|
+
alphaTest: 0.1
|
|
3541
|
+
});
|
|
3542
|
+
const sprite = new THREE2.Sprite(material);
|
|
3543
|
+
const w = texture.image.width;
|
|
3544
|
+
const h = texture.image.height;
|
|
3545
|
+
const base = 1 / 16;
|
|
3546
|
+
const normalizedScale = options.scale / this.getMap().getGLRes();
|
|
3547
|
+
sprite.scale.set(w * base * normalizedScale, h * base * normalizedScale, 1);
|
|
3548
|
+
this.#altitudeOffset = Math.max(
|
|
3549
|
+
h * base * options.scale * 0.5,
|
|
3550
|
+
0.05
|
|
3551
|
+
// minimum lift in world units
|
|
3697
3552
|
);
|
|
3553
|
+
return sprite;
|
|
3698
3554
|
}
|
|
3699
|
-
|
|
3700
|
-
|
|
3701
|
-
|
|
3702
|
-
|
|
3703
|
-
|
|
3704
|
-
|
|
3705
|
-
|
|
3706
|
-
|
|
3707
|
-
|
|
3708
|
-
|
|
3709
|
-
|
|
3710
|
-
|
|
3711
|
-
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3715
|
-
|
|
3716
|
-
|
|
3555
|
+
_createTextTexture(text, options = {}) {
|
|
3556
|
+
const {
|
|
3557
|
+
padding,
|
|
3558
|
+
fontSize,
|
|
3559
|
+
fontFamily,
|
|
3560
|
+
fontWeight,
|
|
3561
|
+
lineHeight,
|
|
3562
|
+
background,
|
|
3563
|
+
color,
|
|
3564
|
+
textAlign,
|
|
3565
|
+
strokeColor,
|
|
3566
|
+
strokeWidth,
|
|
3567
|
+
maxWidth
|
|
3568
|
+
} = options || {};
|
|
3569
|
+
const canvas = document.createElement("canvas");
|
|
3570
|
+
const ctx = canvas.getContext("2d");
|
|
3571
|
+
ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
3572
|
+
const paragraphs = String(text).split("\n");
|
|
3573
|
+
const wrappedLines = [];
|
|
3574
|
+
paragraphs.forEach((paragraph) => {
|
|
3575
|
+
if (isNil(maxWidth) || isNaN(maxWidth)) {
|
|
3576
|
+
wrappedLines.push(paragraph);
|
|
3577
|
+
return;
|
|
3578
|
+
}
|
|
3579
|
+
const words = paragraph.split(/\s+/);
|
|
3580
|
+
let currentLine = "";
|
|
3581
|
+
words.forEach((word) => {
|
|
3582
|
+
const testLine = currentLine ? currentLine + " " + word : word;
|
|
3583
|
+
const testWidth = ctx.measureText(testLine).width;
|
|
3584
|
+
if (testWidth > maxWidth && currentLine) {
|
|
3585
|
+
wrappedLines.push(currentLine);
|
|
3586
|
+
currentLine = word;
|
|
3587
|
+
} else {
|
|
3588
|
+
currentLine = testLine;
|
|
3589
|
+
}
|
|
3717
3590
|
});
|
|
3591
|
+
if (currentLine) {
|
|
3592
|
+
wrappedLines.push(currentLine);
|
|
3593
|
+
}
|
|
3718
3594
|
});
|
|
3719
|
-
|
|
3720
|
-
|
|
3595
|
+
const lines = wrappedLines.length ? wrappedLines : [""];
|
|
3596
|
+
const widest = Math.max(...lines.map((l) => ctx.measureText(l).width), 0);
|
|
3597
|
+
const finalWidth = (maxWidth ? Math.min(widest, maxWidth) : widest) + padding * 2;
|
|
3598
|
+
const finalHeight = lineHeight * lines.length + padding * 2;
|
|
3599
|
+
canvas.width = finalWidth;
|
|
3600
|
+
canvas.height = finalHeight;
|
|
3601
|
+
const ctx2 = canvas.getContext("2d");
|
|
3602
|
+
ctx2.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
3603
|
+
ctx2.textAlign = textAlign;
|
|
3604
|
+
if (background && background !== "transparent") {
|
|
3605
|
+
ctx2.fillStyle = background;
|
|
3606
|
+
ctx2.fillRect(0, 0, canvas.width, canvas.height);
|
|
3607
|
+
}
|
|
3608
|
+
lines.forEach((line, i) => {
|
|
3609
|
+
const y = padding + lineHeight * (i + 0.8);
|
|
3610
|
+
let x = padding;
|
|
3611
|
+
if (textAlign === "center") x = canvas.width / 2;
|
|
3612
|
+
if (textAlign === "right" || textAlign === "end")
|
|
3613
|
+
x = canvas.width - padding;
|
|
3614
|
+
if (strokeWidth > 0) {
|
|
3615
|
+
ctx2.lineWidth = strokeWidth;
|
|
3616
|
+
ctx2.lineJoin = "round";
|
|
3617
|
+
ctx2.miterLimit = 2;
|
|
3618
|
+
ctx2.strokeStyle = strokeColor;
|
|
3619
|
+
ctx2.strokeText(line, x, y);
|
|
3620
|
+
}
|
|
3621
|
+
ctx2.fillStyle = color;
|
|
3622
|
+
ctx2.fillText(line, x, y);
|
|
3623
|
+
});
|
|
3624
|
+
const texture = new THREE2.CanvasTexture(canvas);
|
|
3625
|
+
texture.needsUpdate = true;
|
|
3626
|
+
texture.minFilter = THREE2.LinearFilter;
|
|
3627
|
+
return texture;
|
|
3628
|
+
}
|
|
3629
|
+
_updatePosition() {
|
|
3630
|
+
const options = this.getOptions();
|
|
3631
|
+
const layer = options.layer;
|
|
3632
|
+
if (!layer) return;
|
|
3633
|
+
const altitude = (options.altitude || 0) + this.#altitudeOffset;
|
|
3634
|
+
const z = layer.altitudeToVector3(altitude, altitude).x;
|
|
3635
|
+
const position = layer.coordinateToVector3(this._coordinate, z);
|
|
3636
|
+
set(this.properties, "default.position", position);
|
|
3637
|
+
this.getObject3d().position.copy(position);
|
|
3638
|
+
}
|
|
3639
|
+
_animation() {
|
|
3640
|
+
const layer = this.getLayer();
|
|
3641
|
+
if (!this.isAdd || !layer) return;
|
|
3642
|
+
if (this._visible === true) {
|
|
3643
|
+
const zoom = layer.map.getZoom();
|
|
3644
|
+
const object3d = this.getObject3d();
|
|
3645
|
+
const { opacity } = this.getOptions();
|
|
3646
|
+
let opacityValue;
|
|
3647
|
+
if (typeof opacity === "number") {
|
|
3648
|
+
opacityValue = opacity ?? 1;
|
|
3649
|
+
} else if (Array.isArray(opacity.stops)) {
|
|
3650
|
+
opacityValue = interpolateStops(opacity, zoom);
|
|
3651
|
+
} else {
|
|
3652
|
+
throw new Error(`Unknown opacity value ${opacity}`);
|
|
3653
|
+
}
|
|
3654
|
+
const visible = opacityValue > 0.5;
|
|
3655
|
+
object3d.visible = visible;
|
|
3656
|
+
}
|
|
3657
|
+
}
|
|
3658
|
+
setText(text) {
|
|
3659
|
+
const options = this.getOptions();
|
|
3660
|
+
options.text = text;
|
|
3661
|
+
const newSprite = this._createSprite();
|
|
3662
|
+
const group = this.getObject3d();
|
|
3663
|
+
group.children.forEach((child) => group.remove(child));
|
|
3664
|
+
group.add(newSprite);
|
|
3665
|
+
this._updatePosition();
|
|
3666
|
+
}
|
|
3667
|
+
setAltitude(altitude) {
|
|
3668
|
+
const bottomHeight = this.options.bottomHeight ?? 0;
|
|
3669
|
+
return super.setAltitude(altitude + bottomHeight + this.#altitudeOffset);
|
|
3721
3670
|
}
|
|
3722
|
-
return material;
|
|
3723
3671
|
};
|
|
3724
3672
|
|
|
3725
3673
|
// src/IndoorMap/renderer/3d/Marker3DRenderer.ts
|
|
@@ -3770,40 +3718,41 @@ var Marker3DRenderer = class extends EventTarget {
|
|
|
3770
3718
|
});
|
|
3771
3719
|
}
|
|
3772
3720
|
/** Marker */
|
|
3773
|
-
getOrCreateIconMaterial(key) {
|
|
3774
|
-
|
|
3775
|
-
|
|
3776
|
-
|
|
3777
|
-
|
|
3778
|
-
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
|
|
3789
|
-
|
|
3790
|
-
|
|
3791
|
-
|
|
3792
|
-
|
|
3793
|
-
|
|
3794
|
-
|
|
3795
|
-
|
|
3796
|
-
|
|
3797
|
-
|
|
3798
|
-
|
|
3799
|
-
|
|
3800
|
-
|
|
3801
|
-
|
|
3802
|
-
|
|
3803
|
-
|
|
3804
|
-
|
|
3805
|
-
|
|
3806
|
-
|
|
3721
|
+
// getOrCreateIconMaterial(key) {
|
|
3722
|
+
// if (!this.materialByKey) this.materialByKey = new Map()
|
|
3723
|
+
// const existingMaterial = this.materialByKey.get(key)
|
|
3724
|
+
// if (existingMaterial) return existingMaterial
|
|
3725
|
+
// // Create new
|
|
3726
|
+
// const baseSymbol: maptalks.Path = {
|
|
3727
|
+
// markerType: "path",
|
|
3728
|
+
// markerPath: [
|
|
3729
|
+
// {
|
|
3730
|
+
// path: "M20.775 1.2H1.225V20.35H8.215L11.3 22.8L14.385 20.35H20.775V1.2Z",
|
|
3731
|
+
// fill: "#ff0000",
|
|
3732
|
+
// },
|
|
3733
|
+
// ],
|
|
3734
|
+
// markerPathWidth: 24,
|
|
3735
|
+
// markerPathHeight: 24
|
|
3736
|
+
// }
|
|
3737
|
+
// const markerSymbol: maptalks.PathMarkerSymbol = {
|
|
3738
|
+
// markerType: "path",
|
|
3739
|
+
// markerPath: [],
|
|
3740
|
+
// // TODO: Get Path by featureType.category
|
|
3741
|
+
// // markerPath: [{ fill: "#FFFFFF", path: "M 19 3 H 5 c -1.1 0 -2 0.9 -2 2 v 14 c 0 1.1 0.9 2 2 2 h 14 c 1.1 0 2 -0.9 2 -2 V 5 c 0 -1.1 -0.9 -2 -2 -2 Z m -2 6 h -1.7 l -5 9 H 7 c -0.83 0 -1.5 -0.67 -1.5 -1.5 S 6.17 15 7 15 h 1.7 l 5 -9 H 17 c 0.83 0 1.5 0.67 1.5 1.5 S 17.83 9 17 9 Z" }],
|
|
3742
|
+
// markerPathWidth: 24,
|
|
3743
|
+
// markerPathHeight: 24,
|
|
3744
|
+
// markerWidth: 24,
|
|
3745
|
+
// markerHeight: 24,
|
|
3746
|
+
// markerDy: 1.5,
|
|
3747
|
+
// markerDx: 1.5,
|
|
3748
|
+
// }
|
|
3749
|
+
// const created = createSpriteMaterialByLabelSymbol([
|
|
3750
|
+
// baseSymbol,
|
|
3751
|
+
// markerSymbol,
|
|
3752
|
+
// ])
|
|
3753
|
+
// this.materialByKey.set(key, created)
|
|
3754
|
+
// return created
|
|
3755
|
+
// }
|
|
3807
3756
|
};
|
|
3808
3757
|
|
|
3809
3758
|
// src/IndoorMap/renderer/utils/angleBetweenLineString.ts
|
|
@@ -3825,6 +3774,9 @@ var angleBetweenLineStrings = (line1, line2) => {
|
|
|
3825
3774
|
};
|
|
3826
3775
|
|
|
3827
3776
|
// src/IndoorMap/renderer/RendererManager.ts
|
|
3777
|
+
function delay(ms) {
|
|
3778
|
+
return new Promise((resolve) => setTimeout(resolve, ms));
|
|
3779
|
+
}
|
|
3828
3780
|
var RendererManager = class extends EventTarget {
|
|
3829
3781
|
map;
|
|
3830
3782
|
options;
|
|
@@ -3908,6 +3860,7 @@ var RendererManager = class extends EventTarget {
|
|
|
3908
3860
|
}
|
|
3909
3861
|
};
|
|
3910
3862
|
async #createElements() {
|
|
3863
|
+
await delay(this.options.delayBeforeCreateElements ?? 0);
|
|
3911
3864
|
const levels = await this.#dataClient.filterByType("level", {
|
|
3912
3865
|
populate: true
|
|
3913
3866
|
});
|
|
@@ -4255,33 +4208,15 @@ var IndoorMap = class extends EventTarget {
|
|
|
4255
4208
|
create3DFootprint,
|
|
4256
4209
|
create3DGroundLabel,
|
|
4257
4210
|
create3DBillboard,
|
|
4258
|
-
createVenue3DModel,
|
|
4259
4211
|
createExtrudedUnit,
|
|
4260
|
-
create3DFixture,
|
|
4261
4212
|
create3DAmenityMarker,
|
|
4262
4213
|
create3DOccupantAmenityMarker,
|
|
4263
4214
|
create3DOpeningMarker,
|
|
4264
|
-
createOccupantGroundLabel
|
|
4265
|
-
// Light
|
|
4266
|
-
createAmbientLight,
|
|
4267
|
-
createDirectionalLight
|
|
4215
|
+
createOccupantGroundLabel
|
|
4268
4216
|
} = this.#styler;
|
|
4269
4217
|
let elements = {};
|
|
4270
4218
|
let object3ds = [];
|
|
4271
4219
|
const scene = this.threeLayer.getScene();
|
|
4272
|
-
if (scene) {
|
|
4273
|
-
const {
|
|
4274
|
-
ambientLight: ambientLightConfig = {},
|
|
4275
|
-
directionalLight: directionalLightConfig = {}
|
|
4276
|
-
} = _6.get(this.#mapConfig, "light", {
|
|
4277
|
-
ambientLight: {},
|
|
4278
|
-
directionalLight: {}
|
|
4279
|
-
});
|
|
4280
|
-
const ambientLight = createAmbientLight(ambientLightConfig);
|
|
4281
|
-
scene.add(ambientLight);
|
|
4282
|
-
const light = createDirectionalLight(directionalLightConfig);
|
|
4283
|
-
scene.add(light);
|
|
4284
|
-
}
|
|
4285
4220
|
for (const feature2 of this.#features) {
|
|
4286
4221
|
try {
|
|
4287
4222
|
const { feature_type: featureType, properties, id } = feature2;
|
|
@@ -4304,16 +4239,6 @@ var IndoorMap = class extends EventTarget {
|
|
|
4304
4239
|
feature2
|
|
4305
4240
|
);
|
|
4306
4241
|
switch (featureType) {
|
|
4307
|
-
case "venue": {
|
|
4308
|
-
geometry = createVenue(feature2).addTo(layer);
|
|
4309
|
-
const models = await createVenue3DModel(feature2, this.threeLayer);
|
|
4310
|
-
models.forEach((model) => {
|
|
4311
|
-
model.on("click", this.handleClickElement);
|
|
4312
|
-
object3ds.push(model);
|
|
4313
|
-
this.#venueObjects.push(model);
|
|
4314
|
-
});
|
|
4315
|
-
break;
|
|
4316
|
-
}
|
|
4317
4242
|
case "amenity": {
|
|
4318
4243
|
if (feature2.properties.is_featured) {
|
|
4319
4244
|
const billboardObj = create3DBillboard(feature2, this.threeLayer);
|
|
@@ -4357,127 +4282,6 @@ var IndoorMap = class extends EventTarget {
|
|
|
4357
4282
|
geometry = createSection(feature2)?.addTo(layer);
|
|
4358
4283
|
break;
|
|
4359
4284
|
}
|
|
4360
|
-
case "occupant": {
|
|
4361
|
-
switch (category) {
|
|
4362
|
-
// Create only marker if it is amenity occupant
|
|
4363
|
-
case "currencyexchange":
|
|
4364
|
-
case "donationcenter":
|
|
4365
|
-
case "postoffice":
|
|
4366
|
-
const markerFeature = {
|
|
4367
|
-
...feature2,
|
|
4368
|
-
geometry: feature2.properties?.anchor?.geometry
|
|
4369
|
-
};
|
|
4370
|
-
const marker3d = create3DOccupantAmenityMarker(
|
|
4371
|
-
markerFeature,
|
|
4372
|
-
this.threeLayer,
|
|
4373
|
-
extrudeConfig
|
|
4374
|
-
)?.on("click", this.handleClickElement);
|
|
4375
|
-
object3ds.push(marker3d);
|
|
4376
|
-
break;
|
|
4377
|
-
default: {
|
|
4378
|
-
const { kiosk, anchor } = feature2.properties;
|
|
4379
|
-
const { unit } = anchor.properties;
|
|
4380
|
-
let mainLocation = kiosk || unit || null;
|
|
4381
|
-
const relatedLocations = [
|
|
4382
|
-
...feature2.properties.units,
|
|
4383
|
-
...feature2.properties.kiosks
|
|
4384
|
-
].filter((f) => f.properties.ordinal !== properties.ordinal);
|
|
4385
|
-
const occupantLocations = [mainLocation, ...relatedLocations];
|
|
4386
|
-
const renderType = feature2.properties.render_type;
|
|
4387
|
-
occupantLocations.forEach((location, index) => {
|
|
4388
|
-
const isMainLocation = index === 0;
|
|
4389
|
-
if (renderType === "Label") {
|
|
4390
|
-
const occupantGroundLabel = createOccupantGroundLabel(
|
|
4391
|
-
feature2,
|
|
4392
|
-
location,
|
|
4393
|
-
{ textMarkerType, extrudeConfig },
|
|
4394
|
-
this.threeLayer
|
|
4395
|
-
);
|
|
4396
|
-
if (occupantGroundLabel instanceof GroundLabel) {
|
|
4397
|
-
occupantGroundLabel.on("click", this.handleClickElement);
|
|
4398
|
-
occupantGroundLabel.addTo(this.threeLayer);
|
|
4399
|
-
object3ds.push(occupantGroundLabel);
|
|
4400
|
-
this.#groundObjects.push(occupantGroundLabel);
|
|
4401
|
-
}
|
|
4402
|
-
} else {
|
|
4403
|
-
const occupantMarker = createOccupant(feature2, location, {
|
|
4404
|
-
textMarkerType,
|
|
4405
|
-
extrudeConfig
|
|
4406
|
-
});
|
|
4407
|
-
if (occupantMarker instanceof ui3.UIMarker) {
|
|
4408
|
-
occupantMarker.addTo(this.map);
|
|
4409
|
-
} else {
|
|
4410
|
-
occupantMarker?.on("click", this.handleClickElement);
|
|
4411
|
-
occupantMarker?.addTo(layer);
|
|
4412
|
-
}
|
|
4413
|
-
if (isMainLocation) {
|
|
4414
|
-
geometry = occupantMarker;
|
|
4415
|
-
} else {
|
|
4416
|
-
elements[`${feature2.id}_${index}`] = {
|
|
4417
|
-
geometry: occupantMarker,
|
|
4418
|
-
properties: location.properties,
|
|
4419
|
-
featureType: "occupant",
|
|
4420
|
-
feature: feature2
|
|
4421
|
-
};
|
|
4422
|
-
}
|
|
4423
|
-
}
|
|
4424
|
-
});
|
|
4425
|
-
}
|
|
4426
|
-
}
|
|
4427
|
-
break;
|
|
4428
|
-
}
|
|
4429
|
-
case "fixture": {
|
|
4430
|
-
const models = await create3DFixture(feature2, this.threeLayer);
|
|
4431
|
-
models.forEach((model) => {
|
|
4432
|
-
model.on("click", this.handleClickElement);
|
|
4433
|
-
object3ds.push(model);
|
|
4434
|
-
this.#glbObjects.push(model);
|
|
4435
|
-
});
|
|
4436
|
-
if (!featureExtrudeConfig) {
|
|
4437
|
-
geometry = createFixture(feature2)?.addTo(layer);
|
|
4438
|
-
} else {
|
|
4439
|
-
const locatedLevel = feature2?.properties?.level;
|
|
4440
|
-
const levelExtrudeConfig = getExtrudeConfigByFeature(
|
|
4441
|
-
extrudeConfig,
|
|
4442
|
-
locatedLevel
|
|
4443
|
-
);
|
|
4444
|
-
const levelHeight = _6.get(levelExtrudeConfig, "height", 0);
|
|
4445
|
-
const option = { ...featureExtrudeConfig, altitude: levelHeight };
|
|
4446
|
-
const extrudedFixture = createExtrudedUnit(
|
|
4447
|
-
feature2,
|
|
4448
|
-
this.threeLayer,
|
|
4449
|
-
option
|
|
4450
|
-
);
|
|
4451
|
-
object3ds.push(extrudedFixture);
|
|
4452
|
-
}
|
|
4453
|
-
break;
|
|
4454
|
-
}
|
|
4455
|
-
case "footprint": {
|
|
4456
|
-
const objects = await create3DFootprint(
|
|
4457
|
-
feature2,
|
|
4458
|
-
this.threeLayer,
|
|
4459
|
-
featureExtrudeConfig
|
|
4460
|
-
);
|
|
4461
|
-
objects.forEach((object) => {
|
|
4462
|
-
object.on("click", () => {
|
|
4463
|
-
const {
|
|
4464
|
-
geometry: { coordinates }
|
|
4465
|
-
} = turfCenter3(feature2);
|
|
4466
|
-
this.camera.animateTo({ center: coordinates, pitch: 45 });
|
|
4467
|
-
});
|
|
4468
|
-
object3ds.push(object);
|
|
4469
|
-
this.#objects.push(object);
|
|
4470
|
-
});
|
|
4471
|
-
if (feature2.properties.logo) {
|
|
4472
|
-
const footprintMarker = create3DBillboard(
|
|
4473
|
-
feature2,
|
|
4474
|
-
this.threeLayer
|
|
4475
|
-
);
|
|
4476
|
-
object3ds.push(footprintMarker);
|
|
4477
|
-
this.#billboardObjects.push(footprintMarker);
|
|
4478
|
-
}
|
|
4479
|
-
break;
|
|
4480
|
-
}
|
|
4481
4285
|
default:
|
|
4482
4286
|
break;
|
|
4483
4287
|
}
|
|
@@ -5145,6 +4949,7 @@ export {
|
|
|
5145
4949
|
MARKER_LAYER_NAME,
|
|
5146
4950
|
NONIMDF_FEATURE_TYPES,
|
|
5147
4951
|
ORIGIN_MARKER_ID,
|
|
4952
|
+
occupant_helper_exports as OccupantHelpers,
|
|
5148
4953
|
POI_MARKER_LAYER_NAME,
|
|
5149
4954
|
QueryObserver2 as QueryObserver,
|
|
5150
4955
|
USER_LOCATION_ELEMENT_ID,
|
|
@@ -5172,6 +4977,16 @@ export {
|
|
|
5172
4977
|
getRelatedLocationsByOccupant,
|
|
5173
4978
|
getSuitablyValueBetweenBearings,
|
|
5174
4979
|
isClickableFeature,
|
|
4980
|
+
isValidCoordinate,
|
|
4981
|
+
isValidLineString,
|
|
4982
|
+
isValidLineStringCoordinates,
|
|
4983
|
+
isValidMultiPolygon,
|
|
4984
|
+
isValidMultiPolygonCoordinates,
|
|
4985
|
+
isValidPoint,
|
|
4986
|
+
isValidPolygon,
|
|
4987
|
+
isValidPolygonCoordinates,
|
|
4988
|
+
matchFilter,
|
|
4989
|
+
matchFilters,
|
|
5175
4990
|
safeFetchFeature,
|
|
5176
4991
|
styledFeatureGenerator
|
|
5177
4992
|
};
|