+
-
diff --git a/package-lock.json b/package-lock.json
index ccd9c69..6954f72 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
"dependencies": {
"normalize.css": "^8.0.1",
"proj4": "^2.6.3",
- "three": "^0.124.0"
+ "three": "^0.125.1"
},
"devDependencies": {
"@babel/core": "^7.12.9",
@@ -1740,9 +1740,9 @@
}
},
"node_modules/caniuse-lite": {
- "version": "1.0.30001179",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001179.tgz",
- "integrity": "sha512-blMmO0QQujuUWZKyVrD1msR4WNDAqb/UPO1Sw2WWsQ7deoM5bJiicKnWJ1Y0NS/aGINSnKPIWBMw5luX+NDUCA==",
+ "version": "1.0.30001181",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001181.tgz",
+ "integrity": "sha512-m5ul/ARCX50JB8BSNM+oiPmQrR5UmngaQ3QThTTp5HcIIQGP/nPBs82BYLE+tigzm3VW+F4BJIhUyaVtEweelQ==",
"dev": true
},
"node_modules/chalk": {
@@ -2090,9 +2090,9 @@
}
},
"node_modules/electron-to-chromium": {
- "version": "1.3.645",
- "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.645.tgz",
- "integrity": "sha512-T7mYop3aDpRHIQaUYcmzmh6j9MAe560n6ukqjJMbVC6bVTau7dSpvB18bcsBPPtOSe10cKxhJFtlbEzLa0LL1g==",
+ "version": "1.3.648",
+ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.648.tgz",
+ "integrity": "sha512-4POzwyQ80tkDiBwkxn7IpfzioimrjRSFX1sCQ3pLZsYJ5ERYmwzdq0hZZ3nFP7Z6GtmnSn3xwWDm8FPlMeOoEQ==",
"dev": true
},
"node_modules/emoji-regex": {
@@ -2315,9 +2315,9 @@
"dev": true
},
"node_modules/fastq": {
- "version": "1.10.0",
- "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.10.0.tgz",
- "integrity": "sha512-NL2Qc5L3iQEsyYzweq7qfgy5OtXCmGzGvhElGEd/SoFWEMOEczNh5s5ocaF01HDetxz+p8ecjNPA6cZxxIHmzA==",
+ "version": "1.10.1",
+ "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.10.1.tgz",
+ "integrity": "sha512-AWuv6Ery3pM+dY7LYS8YIaCiQvUaos9OB1RyNgaOWnaX+Tik7Onvcsf8x8c+YtDeT0maYLniBip2hox5KtEXXA==",
"dev": true,
"peer": true,
"dependencies": {
@@ -3244,9 +3244,9 @@
}
},
"node_modules/mini-css-extract-plugin": {
- "version": "1.3.4",
- "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.4.tgz",
- "integrity": "sha512-dNjqyeogUd8ucUgw5sxm1ahvSfSUgef7smbmATRSbDm4EmNx5kQA6VdUEhEeCKSjX6CTYjb5vxgMUvRjqP3uHg==",
+ "version": "1.3.5",
+ "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.5.tgz",
+ "integrity": "sha512-tvmzcwqJJXau4OQE5vT72pRT18o2zF+tQJp8CWchqvfQnTlflkzS+dANYcRdyPRWUWRkfmeNTKltx0NZI/b5dQ==",
"dev": true,
"dependencies": {
"loader-utils": "^2.0.0",
@@ -4340,9 +4340,9 @@
}
},
"node_modules/three": {
- "version": "0.124.0",
- "resolved": "https://registry.npmjs.org/three/-/three-0.124.0.tgz",
- "integrity": "sha512-ROXp1Ly7YyF+jC910DQyAWj++Qlw2lQv0qwYLNQwdDbjk4bsOXAfGO92wYTMPNei1GMJUmCxSxc3MjGBTS09Rg=="
+ "version": "0.125.2",
+ "resolved": "https://registry.npmjs.org/three/-/three-0.125.2.tgz",
+ "integrity": "sha512-7rIRO23jVKWcAPFdW/HREU2NZMGWPBZ4XwEMt0Ak0jwLUKVJhcKM55eCBWyGZq/KiQbeo1IeuAoo/9l2dzhTXA=="
},
"node_modules/to-fast-properties": {
"version": "2.0.0",
@@ -6361,9 +6361,9 @@
"dev": true
},
"caniuse-lite": {
- "version": "1.0.30001179",
- "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001179.tgz",
- "integrity": "sha512-blMmO0QQujuUWZKyVrD1msR4WNDAqb/UPO1Sw2WWsQ7deoM5bJiicKnWJ1Y0NS/aGINSnKPIWBMw5luX+NDUCA==",
+ "version": "1.0.30001181",
+ "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001181.tgz",
+ "integrity": "sha512-m5ul/ARCX50JB8BSNM+oiPmQrR5UmngaQ3QThTTp5HcIIQGP/nPBs82BYLE+tigzm3VW+F4BJIhUyaVtEweelQ==",
"dev": true
},
"chalk": {
@@ -6630,9 +6630,9 @@
"dev": true
},
"electron-to-chromium": {
- "version": "1.3.645",
- "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.645.tgz",
- "integrity": "sha512-T7mYop3aDpRHIQaUYcmzmh6j9MAe560n6ukqjJMbVC6bVTau7dSpvB18bcsBPPtOSe10cKxhJFtlbEzLa0LL1g==",
+ "version": "1.3.648",
+ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.648.tgz",
+ "integrity": "sha512-4POzwyQ80tkDiBwkxn7IpfzioimrjRSFX1sCQ3pLZsYJ5ERYmwzdq0hZZ3nFP7Z6GtmnSn3xwWDm8FPlMeOoEQ==",
"dev": true
},
"emoji-regex": {
@@ -6806,9 +6806,9 @@
"dev": true
},
"fastq": {
- "version": "1.10.0",
- "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.10.0.tgz",
- "integrity": "sha512-NL2Qc5L3iQEsyYzweq7qfgy5OtXCmGzGvhElGEd/SoFWEMOEczNh5s5ocaF01HDetxz+p8ecjNPA6cZxxIHmzA==",
+ "version": "1.10.1",
+ "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.10.1.tgz",
+ "integrity": "sha512-AWuv6Ery3pM+dY7LYS8YIaCiQvUaos9OB1RyNgaOWnaX+Tik7Onvcsf8x8c+YtDeT0maYLniBip2hox5KtEXXA==",
"dev": true,
"peer": true,
"requires": {
@@ -7491,9 +7491,9 @@
"dev": true
},
"mini-css-extract-plugin": {
- "version": "1.3.4",
- "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.4.tgz",
- "integrity": "sha512-dNjqyeogUd8ucUgw5sxm1ahvSfSUgef7smbmATRSbDm4EmNx5kQA6VdUEhEeCKSjX6CTYjb5vxgMUvRjqP3uHg==",
+ "version": "1.3.5",
+ "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.5.tgz",
+ "integrity": "sha512-tvmzcwqJJXau4OQE5vT72pRT18o2zF+tQJp8CWchqvfQnTlflkzS+dANYcRdyPRWUWRkfmeNTKltx0NZI/b5dQ==",
"dev": true,
"requires": {
"loader-utils": "^2.0.0",
@@ -8311,9 +8311,9 @@
}
},
"three": {
- "version": "0.124.0",
- "resolved": "https://registry.npmjs.org/three/-/three-0.124.0.tgz",
- "integrity": "sha512-ROXp1Ly7YyF+jC910DQyAWj++Qlw2lQv0qwYLNQwdDbjk4bsOXAfGO92wYTMPNei1GMJUmCxSxc3MjGBTS09Rg=="
+ "version": "0.125.2",
+ "resolved": "https://registry.npmjs.org/three/-/three-0.125.2.tgz",
+ "integrity": "sha512-7rIRO23jVKWcAPFdW/HREU2NZMGWPBZ4XwEMt0Ak0jwLUKVJhcKM55eCBWyGZq/KiQbeo1IeuAoo/9l2dzhTXA=="
},
"to-fast-properties": {
"version": "2.0.0",
diff --git a/package.json b/package.json
index b15006f..7e72342 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
"dependencies": {
"normalize.css": "^8.0.1",
"proj4": "^2.6.3",
- "three": "^0.124.0"
+ "three": "^0.125.1"
},
"author": "Arno Kaimbacher",
"license": "MIT",
diff --git a/src/css/page.css b/src/css/page.css
index 87531f4..01c76fa 100644
--- a/src/css/page.css
+++ b/src/css/page.css
@@ -59,6 +59,11 @@ section {
justify-content: center;
}*/
+#map-title {
+ display: block;
+ padding: 1em;
+}
+
.btnDownloadMeme {
margin-top: 10px;
}
@@ -101,7 +106,6 @@ section {
}
/* control positioning */
-
.gba-control {
position: relative;
z-index: 7;
@@ -391,7 +395,6 @@ a:hover {
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
-
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
display: inline-block;
height: 38px;
@@ -432,7 +435,6 @@ a:hover {
/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
-
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select {
height: 38px;
padding: 6px 10px;
@@ -722,6 +724,11 @@ there.
/* smaller than tablet */
@media (max-width: 750px) {
+ #map-title {
+ display: none;
+ padding: 1em;
+ }
+
.mapDesktop {
/* overflow: hidden;
position: absolute; */
@@ -830,7 +837,7 @@ ul.tab-nav li span.active.button {
}
.green-label {
- color: #7cfc00;
+ color: #3ad29f;
padding: 2px;
text-shadow: -1px -1px #FFF, 0 -1px #FFF, 1px -1px #FFF, -1px 0 #FFF, 1px 0 #FFF, -1px 1px #FFF, 0 1px #FFF, 1px 1px #FFF;
position: absolute;
@@ -841,8 +848,8 @@ ul.tab-nav li span.active.button {
user-select: none;
}
-.blue-label {
- color: #00bfff;
+.grey-label {
+ color: #6b716f;
padding: 2px;
text-shadow: -1px -1px #FFF, 0 -1px #FFF, 1px -1px #FFF, -1px 0 #FFF, 1px 0 #FFF, -1px 1px #FFF, 0 1px #FFF, 1px 1px #FFF;
position: absolute;
diff --git a/src/js/controls/BasemapControl.css b/src/js/controls/BasemapControl.css
index 52962d7..be6445f 100644
--- a/src/js/controls/BasemapControl.css
+++ b/src/js/controls/BasemapControl.css
@@ -1,3 +1,19 @@
+/* der eigentliche Button */
+.gba-control-basemap-toggle {
+ width: 30px;
+ height: 30px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ cursor: pointer;
+ border-radius: 5px;
+ background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAABLFBMVEWZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmVlZWWlpaXl5eYmJjT09P///+ZmZmdnZ2qqqq3t7fOzs7Pz8/Q0NDR0dHS0tKTk5PU1NTV1dWUlJTKysrMzMzNzc2kpKSlpaWpqambm5uvr6+xsbGioqK+vr7W1tbh4eHi4uLw8PD29vb4+Pj7+/v8/PygoKDY2NjIyMiurq6SkpKwsLCjo6OysrK0tLS1tbW2tracnJy4uLjLy8vZ2dna2trc3Nzf39+6urq8vLzj4+Pl5eXm5ubo6Ojp6enq6uqRkZHz8/P19fW/v7/39/fAwMDCwsKnp6f9/f3+/v6enp7FxcXGxsaampqfn5/Dw8PhTh9TAAAAFHRSTlMAAk9hdXZ+t8fJytPY3N/i7O3v8vSJ2KIAAAFdSURBVHhehZPlcuswEEadpk0Z0orNGGSGMjMz9973f4fGkI7G47rnlzRn9WlntBISqcWVX5hLCsI4i2FMWIjTk8JynJ4R0vwWOQ7i91O8RmZVXRVNHKmxKa62KW3VmIl5HUj20KIeVzJ0QtqB8jX9oVF2AKcBqJxTnrcjyYSBho50TMP0SN5ErsZFu0cjeMzmsasVGk3vCbrhwMsO0yWbwG8NOJVG+ORh0YSjztFtf9Dm7Z36tY6DzjHon6qq0eyM5P2JpuV29iD29L9dxTZ0TSGXXVd2mrqi64Z9UBE9vW/buoum2Dev3QtD0T3qZAN54S//CfEL1EFd0bylZdSqfjiDSPq0ggJfEvJcgOjnSSArZ4b3BxDrQ0KQfzEMSts5v4DYmTUGw+OAwbusWsOOs1slgCOGCYP+maHKoi95HYBgoQp9GejQICPEeKb/+gYT8Z8okZpPR7M0mxS+AQ3gZKp5dNfSAAAAAElFTkSuQmCC') /*img/layer.png*/;
+ /* background-position: 50% 50%; */
+ background-repeat: no-repeat;
+ display: block;
+}
+
.gba_basemap_img {
width: 80px;
height: 80px;
diff --git a/src/js/controls/BasemapControl.js b/src/js/controls/BasemapControl.js
index 58d8c59..e0400e4 100644
--- a/src/js/controls/BasemapControl.js
+++ b/src/js/controls/BasemapControl.js
@@ -6,7 +6,7 @@ import * as domEvent from '../core/domEvent';
import './BasemapControl.css';
-export class BasemapControl extends MobileDialog {
+export class BasemapControl extends Control {
defaultTitle = '3DViewer';
@@ -23,12 +23,12 @@ export class BasemapControl extends MobileDialog {
}
- onAdd(map) {
- super.onAdd(map);
- let basemaps = this.basemaps = map.basemaps;
+ // onAdd(map) {
+ // super.onAdd(map);
+ // let basemaps = this.basemaps = map.basemaps;
- this._initBasemapHtml(basemaps.services);
- }
+ // this._initBasemapHtml(basemaps.services);
+ // }
// onAdd(map) {
// this._mainMap = map;
@@ -57,6 +57,41 @@ export class BasemapControl extends MobileDialog {
// }
// }
+ onAdd(map) {
+ this._initLayout(map);
+ this._map = map;
+ return this._container;
+ }
+
+ _initLayout() {
+ let className = 'gba-control-basemap';
+ let container = this._container = dom.createDom('div', { "class": className });
+ // makes this work on IE touch devices by stopping it from firing a mouseout event when the touch is released
+ container.setAttribute('aria-haspopup', true);
+
+ let link = this._layersLink = dom.createDom('a', { "class": className + '-toggle' }, container);
+ link.href = '#';
+ link.title = 'Base Layers';
+
+ // let popupClassName = "gba-basemap-control";
+ // let dialogContainer = dom.createDom("div", { "class": popupClassName, "id": 'basemap-control-parent' });
+ // domEvent.on(dialogContainer, 'click', domEvent.stopPropagation);
+
+
+ // let dialog = this.dialog = new MobileDialog();
+ this.dialog = new MobileDialog("Baselayer", { klass: "fm_basemap_list", parentDiv: 'basemap-control-parent' }).addTo(this._map);
+ let basemaps = this.basemaps = this._map.basemaps;
+ this._initBasemapHtml(basemaps.services);
+
+ // domEvent.on(link, 'click', this.expand, this);
+ domEvent.on(link, 'click', () => {
+ this.dialog.show();
+ }, this);
+
+ }
+
+
+
_initBasemapHtml(basemapServices) {
for (let i = 0; i < basemapServices.length; i++) {
@@ -68,7 +103,7 @@ export class BasemapControl extends MobileDialog {
//+ "";
var btnLink = dom.createDom('a', {
'class': 'gba_basemap_option'
- }, this.popupcontent);
+ }, this.dialog.popupcontent);
btnLink.dataset.name = basemap.name;
let image = dom.createDom('img', {
@@ -83,7 +118,7 @@ export class BasemapControl extends MobileDialog {
domEvent.on(btnLink, 'click', function (e) {
e.preventDefault();
let name = e.currentTarget.getAttribute('data-name');
- this.setBasemap(name);
+ this._setBasemap(name);
// this.hide();
return false;
}, this);
@@ -92,10 +127,10 @@ export class BasemapControl extends MobileDialog {
}
- setBasemap(name) {
+ _setBasemap(name) {
for (let i = 0; i < this.basemaps.services.length; i++) {
if (this.basemaps.services[i].name === name) {
- let basemap = this.basemaps.services[i];
+ // let basemap = this.basemaps.services[i];
if (this._map.currentBasemap) {
//this.map.removeLayer(this.map.currentBasemap);
this._map.currentBasemap.changeImage(i);
diff --git a/src/js/controls/Coordinates.css b/src/js/controls/Coordinates.css
index 4849fb6..681c4e2 100644
--- a/src/js/controls/Coordinates.css
+++ b/src/js/controls/Coordinates.css
@@ -8,4 +8,5 @@
margin: 0;
color: #333;
font: 11px/1.500 'Open Sans', sans-serif;
+ margin-bottom: 0 !important;
}
\ No newline at end of file
diff --git a/src/js/core/Map.js b/src/js/core/Map.js
index e870fa8..41c9bf9 100644
--- a/src/js/core/Map.js
+++ b/src/js/core/Map.js
@@ -12,22 +12,29 @@ class Map extends OrbitControls {
_controlContainer;
_controls;
- constructor(x, y, z, size, center, camera, scene, domElement, container) {
+ constructor(x, y, z, size, center, camera, scene, container, serviceUrl) {
// call parent constructor of OrbitControls
- super(size, center, camera, scene, domElement);
+ super(size, center, camera, scene, container);
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 Austria";
+
+ // to do: initialize layers via serviceUrl:
this._layers = {};
this.initControls();
diff --git a/src/js/layer/GridLayer.js b/src/js/layer/GridLayer.js
index b263db3..5c9b413 100644
--- a/src/js/layer/GridLayer.js
+++ b/src/js/layer/GridLayer.js
@@ -1,23 +1,17 @@
import { BufferGeometry } from 'three/src/core/BufferGeometry';
import { Float32BufferAttribute } from 'three/src/core/BufferAttribute';
import { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial';
-import { PointsMaterial } from 'three/src/materials/PointsMaterial';
import { LineSegments } from 'three/src/objects/LineSegments';
import { Layer } from './Layer';
import { Group } from 'three/src/objects/Group';
-// import { Color } from 'three/src/math/Color';
import { Vector3 } from 'three/src/math/Vector3';
-import { Geometry } from 'three/src/core/Geometry';
import { Line } from 'three/src/objects/Line';
-import { Points } from 'three/src/objects/Points';
export class GridLayer extends Layer {
constructor(params) {
super();
this.type = 'GridLayer';
-
- //this.features = [];
this.visible = true;
this.opacity = 1;
this.materials = [];
@@ -61,10 +55,8 @@ export class GridLayer extends Layer {
onAdd(map) {
let divisions = 5;
- // let size = map.length / 10;
-
- let gridXZ = this.build(map.length, divisions, map.center.y, map.width);
+ let gridXZ = this.build(map.length, divisions, map.y.max, map.width);
// gridXZ.position.set(this.center.x, this.center.y, this.center.z);
// size = map.width / 10;
@@ -72,7 +64,10 @@ export class GridLayer extends Layer {
// gridYZ.rotation.z = Math.PI / 2;
// gridYZ.position.set(this.center.x, this.center.y, this.center.z);
- let gridY = this.buildY(map.width, divisions, map.center.z, map.width);
+ let gridBottomZ = this.gridBottomZ = -(map.width / 2);
+ this.buildY(map.width, divisions, gridBottomZ, map.width);
+
+ this.buildZ(map.height, divisions, map.y.max);
//waagrechtes grid
// // let gridXY = this.build(map.length, divisions, 0, map.width);
@@ -86,7 +81,30 @@ export class GridLayer extends Layer {
this.getScene().add(this.labelConnectorGroup);
}
- buildY(size, divisions, constant, height) {
+ buildZ(size, divisions, constant) {
+ let step = size / divisions;
+ let vertices = [];
+
+ for (let k = this._map.z.min; k <= this._map.z.max + 1; k = k + step) {
+ vertices.push(this._map.x.min, constant, k, this._map.x.max, constant, k);
+ }
+
+ let geometry = new BufferGeometry();
+ let positions = new Float32BufferAttribute(vertices, 3);
+ geometry.setAttribute('position', positions);
+ let material = new LineBasicMaterial({
+ linewidth: 1,
+ color: 0xA0A1A3
+ });
+ this.materials.push(material);
+
+ //THREE.LineSegments.call(this, geometry, material);
+ let lineSegments = new LineSegments(geometry, material);
+ this.objectGroup.add(lineSegments);
+ return lineSegments;
+ }
+
+ buildY(size, divisions, constant) {
let step = size / divisions;
let vertices = [];
@@ -156,54 +174,41 @@ export class GridLayer extends Layer {
buildLabels(divisions = 5) {
let size = this._map.length;
let step = size / divisions;
-
// this.parent = parent;
// this.parentElement = parentElement;
- // var width = 80;
let labels = new Array();
// for (let k = - halfSize; k <= halfSize; k = k + step) {
for (let k = this._map.x.min; k <= this._map.x.max; k = k + step) {
- if (k % 1 != 0) k = this._round(k, 2);
- let info = { a: k, size: step, axis: "x", color: 0xff0000, cl: "red-label", h: 0.6, centroid: [[k, this._map.center.y, this._map.width / 2]] };
+ let xCoordinate = (k % 1 != 0) ? this._round(k, 2) : k;
+ let info = { a: xCoordinate, size: step, axis: "x", color: 0xff0000, cl: "red-label", h: 0.6, centroid: [[k, this._map.y.max, this._map.width / 2]] };
labels.push(info);
}
- size = this._map.width;
- step = size / divisions;
- for (let k = this._map.y.min; k <= this._map.y.max; k = k + step) {
- if (k % 1 != 0) k = this._round(k, 2);
- let info = { a: k, size: step, axis: "y", color: 0x00ff00, cl: "green-label", h: 0.6, centroid: [[this._map.x.min, k, this._map.center.z]] };
+ let ySize = this._map.width;
+ let yStep = ySize / divisions;
+ for (let k = this._map.y.min; k <= this._map.y.max; k = k + yStep) {
+ let yCoordinate = (k % 1 != 0) ? this._round(k, 2) : k;
+ let info = { a: yCoordinate, size: yStep, axis: "y", color: 0x3ad29f, cl: "green-label", h: 0.6, centroid: [[this._map.x.min, k, this.gridBottomZ]] };
labels.push(info);
}
- //label
- // this.f = [
- // { a: [i18n.widgets.gridlayer.east], cl: "red-label", h: 0.0, centroid: [[0, width / 2 + 15, this.height]], axis: true },
- // { a: [this._map.getMapX(-10)], cl: "red-label", h: 0.0, centroid: [[-10, width / 2, this.height]] },
- // { a: [this._map.getMapX(-20)], cl: "red-label", h: 0.6, centroid: [[-20, width / 2, this.height]] },
- // { a: [this._map.getMapX(-30)], cl: "red-label", h: 0.6, centroid: [[-30, width / 2, this.height]] },
- // { a: [this._map.getMapX(-40)], cl: "red-label", h: 0.6, centroid: [[-40, width / 2, this.height]] },
- // { a: [this._map.getMapX(-50)], cl: "red-label", h: 0.6, hs: 4, centroid: [[-50, width / 2, this.height]] },
- // { a: [this._map.getMapX(0)], cl: "red-label", h: 0.6, centroid: [[0, width / 2, this.height]] },
- // { a: [this._map.getMapX(10)], cl: "red-label", h: 0.6, centroid: [[10, width / 2, this.height]] },
- // { a: [this._map.getMapX(20)], cl: "red-label", h: 0.6, centroid: [[20, width / 2, this.height]] },
- // { a: [this._map.getMapX(30)], cl: "red-label", h: 0.6, centroid: [[30, width / 2, this.height]] },
- // { a: [this._map.getMapX(40)], cl: "red-label", h: 0.6, centroid: [[40, width / 2, this.height]] },
- // { a: [this._map.getMapX(50)], cl: "red-label", h: 0.6, centroid: [[50, width / 2, this.height]] }
- // ];
+ let zSize = this._map.height;
+ let zStep = zSize / divisions;
+ for (let k = this._map.z.min; k <= this._map.z.max + 1; k = k + zStep) {
+ // vertices.push(this._map.x.min, constant, k, this._map.x.max, constant, k);
+ let zCoordinate = (k % 1 != 0) ? this._round(k, 2) : k;
+ let info = { a: zCoordinate, size: yStep, axis: "z", color: 0x6b716f, cl: "grey-label", h: 0.6, centroid: [[this._map.x.min, this._map.y.max, k]] };
+ labels.push(info);
+ }
+
+
var getCentroidFunc = function (f) { return f.centroid; };
// Layer must belong to a project
let labelInfo = this.labelInfo;
if (labelInfo === undefined || getCentroidFunc === undefined) return;
- // // let line_mat = new LineBasicMaterial({ color: Gba3D.Options.label.connectorColor });
- // let line_mat = new LineBasicMaterial({
- // linewidth: 1,
- // color: 0x80CCFF
- // });
- // this.labelConnectorGroup = new Group();
this.labelConnectorGroup.userData.layerId = this.index;
// if (parent) {
// parent.add(this.labelConnectorGroup);
@@ -245,7 +250,6 @@ export class GridLayer extends Layer {
e.className = classLabel;// "label";
this.labelParentElement.appendChild(e);
- // let z = labelHeightFunc(f, pt);
let pt0, pt1;
if (f.axis == "x") {
pt0 = new Vector3(pt[0], pt[1], pt[2]); // bottom
@@ -254,11 +258,15 @@ export class GridLayer extends Layer {
else if (f.axis == "y") {
pt0 = new Vector3(pt[0], pt[1], pt[2]);
pt1 = new Vector3(pt[0] - horizontalShiftLabel - f.size, pt[1], pt[2]);
+ } else if (f.axis == "z") {
+ pt0 = new Vector3(pt[0], pt[1], pt[2]);
+ pt1 = new Vector3(pt[0] - horizontalShiftLabel - f.size, pt[1], pt[2]);
}
- // create connector - not for axis
- // if (f.axis !== true) {
- let geom = new Geometry();
- geom.vertices.push(pt1, pt0);
+
+ let step = size / divisions;
+ let vertices = [];
+ vertices.push(pt1, pt0);
+ let geom = new BufferGeometry().setFromPoints(vertices);
let line = new Line(geom, line_mat);
// line.position.set(this.center.x, this.center.y, this.center.z);
@@ -294,9 +302,9 @@ export class GridLayer extends Layer {
let autosize = true;
let camera = this._map.camera;
let camera_pos = camera.position;
- let c2t = this._map.target.clone().sub(camera_pos);
+ let c2t = this._map.center.clone().sub(camera_pos);
let c2l = new Vector3();
-
+
//neu
// app.labels = app.controls.gridlayer.labels;
let scaleFactor = this.scale;
diff --git a/src/js/main.js b/src/js/main.js
index fe56940..3b8a933 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -152,7 +152,9 @@ class Application {
// this.camera.lookAt(new Vector3(0, 0, 0));
// create map
- this.map = new Map(x, y, z, size, center, this.camera, this.scene, this.renderer.domElement, this.container);
+ let map = this.map = new Map(x, y, z, size, center, this.camera, this.scene, this.container, 'https://geusegdi01.geus.dk/meta3d/rpc/model_meta?modelid=11');
+ this.mapTitle = document.querySelector('#map-title');
+ this.mapTitle.innerHTML += map.title;
// this.map.minDistance = size*0.75;
// this.map.maxDistance = size*15;
@@ -239,7 +241,7 @@ class Application {
}).addTo(this.map);
this.basemapControl = new BasemapControl('Baselayer', {
- parentDiv: 'basemap-control-parent'
+ position: 'topright'
}).addTo(this.map);
//slider for scaling z value
@@ -337,9 +339,9 @@ class Application {
addEventListeners() {
- domEvent.on(this.mapIcon, 'click', () => {
- this.basemapControl.show();
- }, this);
+ // domEvent.on(this.mapIcon, 'click', () => {
+ // this.basemapControl.show();
+ // }, this);
domEvent.on(window, 'resize', this.onWindowResize, this);
domEvent.on(window, 'keydown', this.keydown, this);