@polygonjs/polygonjs
Version:
node-based WebGL 3D engine https://polygonjs.com
117 lines (116 loc) • 4.32 kB
JavaScript
"use strict";
import mapboxgl from "mapbox-gl";
import { MapboxCameraAttribute } from "./MapboxCameraAttribute";
import { MapboxLayersController } from "./LayersController";
import { JsType } from "../../../engine/poly/registers/nodes/types/Js";
import { coreObjectClassFactory } from "../../geometry/CoreObjectFactory";
class MapboxMapsControllerClass {
constructor() {
this._mapByCameraName = /* @__PURE__ */ new Map();
this._resolves = [];
this._styleFlushed = false;
}
static instance() {
return this._instance = this._instance || new MapboxMapsControllerClass();
}
async waitForMap() {
if (this._lastCreatedMap) {
return this._lastCreatedMap;
} else {
return new Promise((resolve, reject) => {
this._resolves.push(resolve);
});
}
}
_flushCallbacksWithMap(map) {
if (this._styleFlushed) {
return;
}
this._styleFlushed = true;
const callbacks = [...this._resolves];
this._resolves.length = 0;
for (const c of callbacks) {
c(map);
}
}
createMap(options) {
const { camera, container, scene, renderFunc, viewer } = options;
this._scene = scene;
const coreObjectClass = coreObjectClassFactory(camera);
const style = coreObjectClass.attribValue(camera, MapboxCameraAttribute.STYLE);
const longitude = coreObjectClass.attribValue(camera, MapboxCameraAttribute.LONGITUDE);
const latitude = coreObjectClass.attribValue(camera, MapboxCameraAttribute.LATITUDE);
const zoom = coreObjectClass.attribValue(camera, MapboxCameraAttribute.ZOOM);
const minZoom = coreObjectClass.attribValue(camera, MapboxCameraAttribute.MIN_ZOOM);
const maxZoom = coreObjectClass.attribValue(camera, MapboxCameraAttribute.MAX_ZOOM);
const pitch = coreObjectClass.attribValue(camera, MapboxCameraAttribute.PITCH);
const bearing = coreObjectClass.attribValue(camera, MapboxCameraAttribute.BEARING);
const allowDragRotate = coreObjectClass.attribValue(camera, MapboxCameraAttribute.ALLOW_DRAG_ROTATE);
const addZoomControl = coreObjectClass.attribValue(camera, MapboxCameraAttribute.ADD_ZOOM_CONTROL);
const tlayerBuildings = coreObjectClass.attribValue(camera, MapboxCameraAttribute.LAYER_BUILDINGS);
const tlayer3D = coreObjectClass.attribValue(camera, MapboxCameraAttribute.LAYER_3D);
const tlayerSky = coreObjectClass.attribValue(camera, MapboxCameraAttribute.LAYER_SKY);
const mapOptions = {
style,
container,
center: [longitude, latitude],
zoom,
minZoom,
maxZoom,
pitch,
bearing,
// preserveDrawingBuffer: true,
dragRotate: allowDragRotate,
pitchWithRotate: allowDragRotate,
antialias: true,
interactive: true
// useWebGL2: true,
};
mapOptions.useWebGL2 = true;
const map = new mapboxgl.Map(mapOptions);
const layersOptions = {
map,
scene,
camera,
renderFunc,
viewer,
lngLat: {
lng: longitude,
lat: latitude
},
displayScene: scene.threejsScene(),
zoomControls: addZoomControl,
layer3D: tlayer3D,
layerBuildings: tlayerBuildings,
layerSky: tlayerSky
};
const layersController = new MapboxLayersController(layersOptions);
map.on("load", () => {
layersController.addLayers();
globalThis.dispatchEvent(new Event("resize"));
});
map.on("styledata", () => {
if (map.isStyleLoaded()) {
if (!this._styleFlushed && this._lastCreatedMap) {
this._flushCallbacksWithMap(this._lastCreatedMap);
}
}
});
map.on("move", () => this._dispatchCameraMove(JsType.ON_MAPBOX_CAMERA_MOVE));
map.on("movestart", () => this._dispatchCameraMove(JsType.ON_MAPBOX_CAMERA_MOVE_START));
map.on("moveend", () => this._dispatchCameraMove(JsType.ON_MAPBOX_CAMERA_MOVE_END));
this._mapByCameraName.set(camera.name, map);
this._lastCreatedMap = map;
return { map, layersController };
}
_dispatchCameraMove(type) {
if (!this._scene) {
return;
}
this._scene.threejsScene().traverse((object) => {
var _a;
(_a = this._scene) == null ? void 0 : _a.actorsManager.triggerEventNodes(object, type);
});
}
}
export const MapboxMapsController = MapboxMapsControllerClass.instance();