diff --git a/modules/scene/sceneSetup.ts b/modules/scene/sceneSetup.ts index 3f2bc045..5bb4eed2 100644 --- a/modules/scene/sceneSetup.ts +++ b/modules/scene/sceneSetup.ts @@ -34,6 +34,7 @@ export default class SceneSetUp { trackballControls: CADTrackballControls; viewportSizeUpdate$ = stream(); sceneRendered$: Emitter = stream(); + viewCube:{}; renderRequested: boolean; @@ -45,6 +46,7 @@ export default class SceneSetUp { this.rootGroup = this.scene; this.scene.userData.sceneSetUp = this; this.renderRequested = false; + this.viewCube = document.querySelector('.cube'); this.setUpCamerasAndLights(); this.setUpControls(); @@ -268,13 +270,18 @@ export default class SceneSetUp { camera.up = new Vector3(0, 1, 0); } - _zoomMeasure() { + _zoomMeasure() { return this.trackballControls.object.position.length() / 1e3; } + + animate() { + let mat = new Matrix4(); + mat.extractRotation( this.camera.matrixWorldInverse ); requestAnimationFrame( () => this.animate() ); const controlsChangedViewpoint = this.trackballControls.evaluate(); + this.viewCube.style.transform = `translateZ(-300px) ${getCameraCSSMatrix( mat )}`; if (controlsChangedViewpoint || this.renderRequested) { this.__render_NeverCallMeFromOutside(); } @@ -303,4 +310,38 @@ export function getSceneSetup(object3D) { return null; } -const ORTHOGRAPHIC_CAMERA_FACTOR = 1; \ No newline at end of file +const ORTHOGRAPHIC_CAMERA_FACTOR = 1; + + + + +function getCameraCSSMatrix(matrix) { + + var elements = matrix.elements; + + return 'matrix3d(' + + epsilon(elements[0]) + ',' + + epsilon(-elements[1]) + ',' + + epsilon(elements[2]) + ',' + + epsilon(elements[3]) + ',' + + epsilon(elements[4]) + ',' + + epsilon(-elements[5]) + ',' + + epsilon(elements[6]) + ',' + + epsilon(elements[7]) + ',' + + epsilon(elements[8]) + ',' + + epsilon(-elements[9]) + ',' + + epsilon(elements[10]) + ',' + + epsilon(elements[11]) + ',' + + epsilon(elements[12]) + ',' + + epsilon(-elements[13]) + ',' + + epsilon(elements[14]) + ',' + + epsilon(elements[15]) + + ')'; + +} + +function epsilon( value ) { + + return Math.abs( value ) < 1e-10 ? 0 : value; + +} \ No newline at end of file diff --git a/web/index.html b/web/index.html index 6d414ff8..03776e0a 100644 --- a/web/index.html +++ b/web/index.html @@ -9,9 +9,107 @@ + +
+
+
front
+
back
+
right
+
left
+
top
+
bottom
+
+
+
+ + +