diff --git a/modules/scene/sceneSetup.js b/modules/scene/sceneSetup.js index 2e5feec8..547884a0 100644 --- a/modules/scene/sceneSetup.js +++ b/modules/scene/sceneSetup.js @@ -55,12 +55,8 @@ export default class SceneSetUp { this.renderer.setClearColor(0x808080, 1); this.renderer.setSize( this.container.clientWidth, this.container.clientHeight ); this.container.appendChild( this.renderer.domElement ); - - window.addEventListener( 'resize', () => { - this.updateViewportSize(); - }, false ); } - + updateViewportSize() { if (this.container.clientWidth > 0 && this.container.clientHeight > 0) { this.updatePerspectiveCameraViewport(); @@ -69,7 +65,16 @@ export default class SceneSetUp { this.render(); } } - + + updateViewportSizeIfNeeded() { + if (this._prevContainerWidth !== this.container.clientWidth || + this._prevContainerHeight !== this.container.clientHeight) { + this.updateViewportSize(); + this._prevContainerWidth = this.container.clientWidth; + this._prevContainerHeight = this.container.clientHeight; + } + } + updatePerspectiveCameraViewport() { this.pCamera.aspect = this.aspect(); this.pCamera.updateProjectionMatrix(); @@ -184,6 +189,7 @@ export default class SceneSetUp { animate() { requestAnimationFrame( () => this.animate() ); this.updateControlsAndHelpers(); + this.updateViewportSizeIfNeeded(); }; render() { diff --git a/web/app/cad/dom/components/View3d.jsx b/web/app/cad/dom/components/View3d.jsx index 70ca6fd1..04a5f6ad 100644 --- a/web/app/cad/dom/components/View3d.jsx +++ b/web/app/cad/dom/components/View3d.jsx @@ -21,7 +21,8 @@ export default class View3d extends React.Component { render() { return -
+
+
diff --git a/web/app/cad/dom/components/View3d.less b/web/app/cad/dom/components/View3d.less index b44c9961..d081e15a 100644 --- a/web/app/cad/dom/components/View3d.less +++ b/web/app/cad/dom/components/View3d.less @@ -8,5 +8,13 @@ flex-direction: column; flex: 1; position: relative; - overflow: hidden; +} + +:global(#viewer-container) { + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: hidden; + position: absolute; }