GeotiefExplore/src/js/core/Map.js
Arno Kaimbacher a09db46a03 - bulma modal
2021-03-22 08:50:36 +01:00

155 lines
No EOL
5 KiB
JavaScript

import { OrbitControls } from '../lib/OrbitControls';
import * as dom from './domUtil';
import { HomeButton } from '../controls/HomeButton';
import { ZoomControl } from '../controls/ZoomControl';
import * as util from './utilities';
import { TinLayer } from '../layer/TinLayer';
class Map extends OrbitControls {
container;
_layers;
_controlCorners;
_controlContainer;
_controls;
camera;
length;
width;
height;
x; y; z;
title;
serviceUrl;
basemaps;
title;
constructor(x, y, z, center, camera, scene, container) {
let size = Math.max(x.max - x.min, y.max - y.min, z.max - z.min);
// call parent constructor of OrbitControls
super(size, center, camera, scene, container);
this.size = size;
this.camera = camera;
this.container = container;
this.length = x.max - x.min;
this.width = y.max - y.min;
this.height = z.max - z.min;
this.x = x;
this.y = y;
this.z = z;
this.center = center;
//init the control corners
if (this._initControlPos) {
this._initControlPos();
}
// to do: initialize map title via serviceUrl:
// this.title = "Geological 3D model of Vienna";
// to do: initialize layers via serviceUrl:
// this.serviceUrl = serviceUrl;
this._layers = {};
this.initControls();
this.basemaps = {
"currentVersion": 10.01,
"services": [
{ "name": "esri:topograhy", "type": "MapServer", 'image': 'background_esri_world_topography.png', 'title': 'ESRI Topograhy' },
{ "name": "esri:imagery", "type": "MapServer", 'image': 'background_esri_world_imagery.png', 'title': 'ESRI Imagery' },
]
};
}
static async build(x, y, z, center, camera, scene, container, serviceUrl) {
const modelData = await util.getMetadata(serviceUrl);
// do your async stuff here
// now instantiate and return a class
let map = new Map(x, y, z, center, camera, scene, container);
map._initDataLayers(modelData.mappedfeatures);
map.title = modelData.model.model_name;
return map;
}
get layers() {
return this._layers;
}
async _initDataLayers(mappedFeatures) {
const callStack = [];
for (let i = 0; i < mappedFeatures.length; i++) {
let layerData = mappedFeatures[i];
let dxfLayer = new TinLayer({
featuregeom_id: layerData.featuregeom_id,
q: true,
type: "3dface",
name: layerData.preview.legend_text, //layerData.legend_description,
description: "test",
color: layerData.preview.legend_color, //layerData.color
citation: layerData.geologicdescription !== null ? layerData.geologicdescription.citation : null,
feature_type: layerData.geologicdescription !== null ? layerData.geologicdescription['feature type'] : null,
});
callStack.push(this.addLayer(dxfLayer))
}
await Promise.all(callStack);
this.emit("ready");
}
_initControlPos() {
//var test = document.getElementById("webgl");
var corners = this._controlCorners = {};
var l = 'gba-';
var container = this._controlContainer =
//util.create('div', l + 'control-container', this.domElement);
dom.createDom("div", { "class": l + 'control-container' }, this.container);
function createCorner(vSide, hSide) {
var className = l + vSide + ' ' + l + hSide;
//corners[vSide + hSide] = util.create('div', className, container);
corners[vSide + hSide] = dom.createDom("div", { "class": className }, container);
}
createCorner('top', 'left');
createCorner('top', 'right');
createCorner('bottom', 'left');
createCorner('bottom', 'right');
}
initControls() {
this._controls = this._controls || {};
// this._controls.homeControl = (new HomeButton()).addTo(this);
let homeControl = this._controls.homeControl = new HomeButton();
homeControl.addTo(this);
let zoomControl = this._controls.zoomControl = new ZoomControl();
zoomControl.addTo(this);
}
async addLayer(layer) {
var id = util.stamp(layer);
if (this._layers[id]) {
return this;
}
this._layers[id] = layer;
//layer._mapToAdd = this;
layer.index = id;
//if (layer.beforeAdd) {
// layer.beforeAdd(this);
//}
//this.whenReady(layer._layerAdd, layer);
await layer._layerAdd(this);
this.emit("change");
return this;
}
hasLayer(layer) {
return !!layer && (util.stamp(layer) in this._layers);
}
}
export { Map };