- #111 Show the dimensions of a model

CHANGELOG.md

@@ -1,3 +1,16 @@
+## 2.1.6
+
+Minor version by [@jscastro76](https://github.com/jscastro76), some enhancements and bugs. 
+
+#### :sparkles: Enhancements
+
+- #111 Show the dimensions of a model 
+- #151 Remove auxiliary test method on CameraSync used to debug #145 
+
+<br>
+
+- - - 
+
 ## 2.1.5
 
 Minor version by [@jscastro76](https://github.com/jscastro76), some enhancements and bugs. 

LICENSE.txt

@@ -1,4 +1,4 @@
-v.2.0.1 - v.2.1.5
+v.2.0.1 - v.2.1.6
 MIT License
 Copyright (c) 2020 Jesus Serrano
 

dist/threebox.js

@@ -485,6 +485,44 @@ Threebox.prototype = {
 				this.tb.zoomLayers.forEach((l) => {this.tb.toggleLayer(l);});
 			}
 
+			let ctrlDown = false;
+			let shiftDown = false;
+			let ctrlKey = 17, cmdKey = 91, shiftKey = 16, sK = 83; dK = 68;
+
+			function onKeyDown(e) {
+
+				if (e.which === ctrlKey || e.which === cmdKey) ctrlDown = true;
+				if (e.which === shiftKey) shiftDown = true;
+				let obj = this.selectedObject;
+				if (shiftDown && e.which === sK && obj) {
+					//shift + sS
+					let dc = utils.toDecimal;
+					if (!obj.help) {
+						let s = obj.modelSize;
+						let sf = 1;
+						if (obj.userData.units !== 'meters') {
+							//if not meters, calculate scale to the current lat
+							sf = utils.projectedUnitsPerMeter(obj.coordinates[1]);
+							if (!sf) { sf = 1; };
+							sf = dc(sf, 7);
+						}
+
+						obj.addHelp("size(m): " + dc((s.x / sf), 3) + " W, " + dc((s.y / sf), 3) + " L, " + dc((s.z / sf), 3) + " H");
+						this.repaint = true;
+					}
+					else {
+						obj.removeHelp();
+					}
+					return false;
+				}
+
+			};
+
+			function onKeyUp (e) {
+				if (e.which == ctrlKey || e.which == cmdKey) ctrlDown = false;
+				if (e.which === shiftKey) shiftDown = false;
+			}
+
 			//listener to the events
 			//this.on('contextmenu', map.onContextMenu);
 			this.on('click', this.onClick);
@@ -493,6 +531,9 @@ Threebox.prototype = {
 			this.on('mousedown', this.onMouseDown);
 			this.on('zoom', this.onZoomEnd);
 
+			document.addEventListener('keydown', onKeyDown.bind(this), true);
+			document.addEventListener('keyup', onKeyUp.bind(this));
+
 		});
 	},
 
@@ -16818,6 +16859,7 @@ Objects.prototype = {
 							obj.remove(obj.boxGroup);
 						}
 						if (obj.label && !obj.label.alwaysVisible) obj.label.visible = false;
+						obj.removeHelp();
 					}
 					if (obj.tooltip) obj.tooltip.visible = value;
 					//only fire the event if value is different
@@ -16928,7 +16970,6 @@ Objects.prototype = {
 			Object.defineProperty(obj, 'modelSize', {
 				get() {
 					_modelSize = obj.getSize();
-					//console.log(_modelSize);
 					return _modelSize;
 				},
 				set(value) {

examples/13-eiffel.html

@@ -85,15 +85,17 @@
 		let date = new Date();
 		let mapConfig = {
 			//			ALL: { center: [-100.021884, 39.609738, 0], zoom: 3.25, pitch: 12, bearing: 0, timezone: 'US/Central' },
-			NYC: { origin: [-74.044514, 40.689259, 47], center: [-74.044803, 40.690183, 0], zoom: 17.7, pitch: 60, bearing: -10, scale: 44, timezone: 'America/New_York' },
-			PAR: { origin: [2.294514, 48.857475, 0], center: [2.294625, 48.861085, 0], zoom: 15.95, pitch: 60, bearing: 0, scale: 0.01029, timezone: 'Europe/Paris' },
+			NYC: {
+				origin: [-74.044514, 40.689259, 47], center: [-74.044803, 40.690183, 0], zoom: 17.7, pitch: 60, bearing: -10, scale: { x: 44, y: 44, z: 44 }, timezone: 'America/New_York' },
+			PAR: {
+				origin: [2.294514, 48.857475, 0], center: [2.294625, 48.861085, 0], zoom: 15.95, pitch: 60, bearing: 0, scale: { x: 0.01039565, y: 0.01039565, z: 0.00997 }, timezone: 'Europe/Paris' },
 			names: {
 				customLayer: "custom-layer",
 				fillExtrusion: "composite-b",
 				fillExtrusionLayer: "building-b"
 			}
 		}
-		let point = mapConfig.PAR;
+		let point = mapConfig.NYC;
 		let p = document.querySelector("#hour");
 
 		let styles = {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "threebox-plugin",
-    "version": "2.1.5",
+    "version": "2.1.6",
     "description": "A Three.js plugin for Mapbox GL JS, using the CustomLayerInterface feature. Provides convenient methods to manage objects in lnglat coordinates, and to synchronize the map and scene cameras.",
     "main": "main.js",
     "repository": {

src/Threebox.js

@@ -480,6 +480,44 @@ Threebox.prototype = {
 				this.tb.zoomLayers.forEach((l) => {this.tb.toggleLayer(l);});
 			}
 
+			let ctrlDown = false;
+			let shiftDown = false;
+			let ctrlKey = 17, cmdKey = 91, shiftKey = 16, sK = 83; dK = 68;
+
+			function onKeyDown(e) {
+
+				if (e.which === ctrlKey || e.which === cmdKey) ctrlDown = true;
+				if (e.which === shiftKey) shiftDown = true;
+				let obj = this.selectedObject;
+				if (shiftDown && e.which === sK && obj) {
+					//shift + sS
+					let dc = utils.toDecimal;
+					if (!obj.help) {
+						let s = obj.modelSize;
+						let sf = 1;
+						if (obj.userData.units !== 'meters') {
+							//if not meters, calculate scale to the current lat
+							sf = utils.projectedUnitsPerMeter(obj.coordinates[1]);
+							if (!sf) { sf = 1; };
+							sf = dc(sf, 7);
+						}
+
+						obj.addHelp("size(m): " + dc((s.x / sf), 3) + " W, " + dc((s.y / sf), 3) + " L, " + dc((s.z / sf), 3) + " H");
+						this.repaint = true;
+					}
+					else {
+						obj.removeHelp();
+					}
+					return false;
+				}
+
+			};
+
+			function onKeyUp (e) {
+				if (e.which == ctrlKey || e.which == cmdKey) ctrlDown = false;
+				if (e.which === shiftKey) shiftDown = false;
+			}
+
 			//listener to the events
 			//this.on('contextmenu', map.onContextMenu);
 			this.on('click', this.onClick);
@@ -488,6 +526,9 @@ Threebox.prototype = {
 			this.on('mousedown', this.onMouseDown);
 			this.on('zoom', this.onZoomEnd);
 
+			document.addEventListener('keydown', onKeyDown.bind(this), true);
+			document.addEventListener('keyup', onKeyUp.bind(this));
+
 		});
 	},
 

src/objects/objects.js

@@ -575,6 +575,7 @@ Objects.prototype = {
 							obj.remove(obj.boxGroup);
 						}
 						if (obj.label && !obj.label.alwaysVisible) obj.label.visible = false;
+						obj.removeHelp();
 					}
 					if (obj.tooltip) obj.tooltip.visible = value;
 					//only fire the event if value is different
@@ -685,7 +686,6 @@ Objects.prototype = {
 			Object.defineProperty(obj, 'modelSize', {
 				get() {
 					_modelSize = obj.getSize();
-					//console.log(_modelSize);
 					return _modelSize;
 				},
 				set(value) {

tests/threebox-tests-bundle.js

@@ -9423,6 +9423,44 @@ Threebox.prototype = {
 				this.tb.zoomLayers.forEach((l) => {this.tb.toggleLayer(l);});
 			}
 
+			let ctrlDown = false;
+			let shiftDown = false;
+			let ctrlKey = 17, cmdKey = 91, shiftKey = 16, sK = 83; dK = 68;
+
+			function onKeyDown(e) {
+
+				if (e.which === ctrlKey || e.which === cmdKey) ctrlDown = true;
+				if (e.which === shiftKey) shiftDown = true;
+				let obj = this.selectedObject;
+				if (shiftDown && e.which === sK && obj) {
+					//shift + sS
+					let dc = utils.toDecimal;
+					if (!obj.help) {
+						let s = obj.modelSize;
+						let sf = 1;
+						if (obj.userData.units !== 'meters') {
+							//if not meters, calculate scale to the current lat
+							sf = utils.projectedUnitsPerMeter(obj.coordinates[1]);
+							if (!sf) { sf = 1; };
+							sf = dc(sf, 7);
+						}
+
+						obj.addHelp("size(m): " + dc((s.x / sf), 3) + " W, " + dc((s.y / sf), 3) + " L, " + dc((s.z / sf), 3) + " H");
+						this.repaint = true;
+					}
+					else {
+						obj.removeHelp();
+					}
+					return false;
+				}
+
+			};
+
+			function onKeyUp (e) {
+				if (e.which == ctrlKey || e.which == cmdKey) ctrlDown = false;
+				if (e.which === shiftKey) shiftDown = false;
+			}
+
 			//listener to the events
 			//this.on('contextmenu', map.onContextMenu);
 			this.on('click', this.onClick);
@@ -9431,6 +9469,9 @@ Threebox.prototype = {
 			this.on('mousedown', this.onMouseDown);
 			this.on('zoom', this.onZoomEnd);
 
+			document.addEventListener('keydown', onKeyDown.bind(this), true);
+			document.addEventListener('keyup', onKeyUp.bind(this));
+
 		});
 	},
 
@@ -25756,6 +25797,7 @@ Objects.prototype = {
 							obj.remove(obj.boxGroup);
 						}
 						if (obj.label && !obj.label.alwaysVisible) obj.label.visible = false;
+						obj.removeHelp();
 					}
 					if (obj.tooltip) obj.tooltip.visible = value;
 					//only fire the event if value is different
@@ -25866,7 +25908,6 @@ Objects.prototype = {
 			Object.defineProperty(obj, 'modelSize', {
 				get() {
 					_modelSize = obj.getSize();
-					//console.log(_modelSize);
 					return _modelSize;
 				},
 				set(value) {