diff --git a/src/extensions/core/load3d/Load3d.ts b/src/extensions/core/load3d/Load3d.ts index 14f597fbf..28b53af7c 100644 --- a/src/extensions/core/load3d/Load3d.ts +++ b/src/extensions/core/load3d/Load3d.ts @@ -38,6 +38,7 @@ class Load3d { STATUS_MOUSE_ON_NODE: boolean STATUS_MOUSE_ON_SCENE: boolean + INITIAL_RENDER_DONE: boolean = false constructor( container: Element | HTMLElement, @@ -132,6 +133,33 @@ class Load3d { this.handleResize() this.startAnimation() + + setTimeout(() => { + this.forceRender() + }, 100) + } + + forceRender(): void { + const delta = this.clock.getDelta() + this.viewHelperManager.update(delta) + this.controlsManager.update() + + this.renderer.clear() + this.sceneManager.renderBackground() + this.renderer.render( + this.sceneManager.scene, + this.cameraManager.activeCamera + ) + + if (this.viewHelperManager.viewHelper.render) { + this.viewHelperManager.viewHelper.render(this.renderer) + } + + if (this.previewManager.showPreview) { + this.previewManager.updatePreviewRender() + } + + this.INITIAL_RENDER_DONE = true } private getActiveCamera(): THREE.Camera { @@ -150,6 +178,10 @@ class Load3d { const animate = () => { this.animationFrameId = requestAnimationFrame(animate) + if (!this.isActive()) { + return + } + if (this.previewManager.showPreview) { this.previewManager.updatePreviewRender() } @@ -182,15 +214,16 @@ class Load3d { } isActive(): boolean { - return this.STATUS_MOUSE_ON_NODE || this.STATUS_MOUSE_ON_SCENE + return ( + this.STATUS_MOUSE_ON_NODE || + this.STATUS_MOUSE_ON_SCENE || + !this.INITIAL_RENDER_DONE + ) } setBackgroundColor(color: string): void { this.sceneManager.setBackgroundColor(color) - this.renderer.render( - this.sceneManager.scene, - this.cameraManager.activeCamera - ) + this.forceRender() } async setBackgroundImage(uploadPath: string): Promise { @@ -201,6 +234,8 @@ class Load3d { this.sceneManager.backgroundTexture ) } + + this.forceRender() } removeBackgroundImage(): void { @@ -212,10 +247,13 @@ class Load3d { ) { this.previewManager.updateBackgroundTexture(null) } + + this.forceRender() } toggleGrid(showGrid: boolean): void { this.sceneManager.toggleGrid(showGrid) + this.forceRender() } toggleCamera(cameraType?: 'perspective' | 'orthographic'): void { @@ -225,6 +263,7 @@ class Load3d { this.viewHelperManager.recreateViewHelper() this.handleResize() + this.forceRender() } getCurrentCameraType(): 'perspective' | 'orthographic' { @@ -237,6 +276,8 @@ class Load3d { if (this.previewManager.showPreview) { this.previewManager.syncWithMainCamera() } + + this.forceRender() } getCameraState(): CameraState { @@ -245,23 +286,17 @@ class Load3d { setFOV(fov: number): void { this.cameraManager.setFOV(fov) - this.renderer.render( - this.sceneManager.scene, - this.cameraManager.activeCamera - ) + this.forceRender() } setEdgeThreshold(threshold: number): void { this.modelManager.setEdgeThreshold(threshold) + this.forceRender() } setMaterialMode(mode: MaterialMode): void { this.modelManager.setMaterialMode(mode) - - this.renderer.render( - this.sceneManager.scene, - this.cameraManager.activeCamera - ) + this.forceRender() } async loadModel(url: string, originalFileName?: string): Promise { @@ -272,31 +307,32 @@ class Load3d { await this.loaderManager.loadModel(url, originalFileName) this.handleResize() + this.forceRender() } clearModel(): void { this.modelManager.clearModel() + this.forceRender() } setUpDirection(direction: UpDirection): void { this.modelManager.setUpDirection(direction) - - this.renderer.render( - this.sceneManager.scene, - this.cameraManager.activeCamera - ) + this.forceRender() } setLightIntensity(intensity: number): void { this.lightingManager.setLightIntensity(intensity) + this.forceRender() } togglePreview(showPreview: boolean): void { this.previewManager.togglePreview(showPreview) + this.forceRender() } setTargetSize(width: number, height: number): void { this.previewManager.setTargetSize(width, height) + this.forceRender() } addEventListener(event: string, callback: (data?: any) => void): void { @@ -309,6 +345,7 @@ class Load3d { refreshViewport(): void { this.handleResize() + this.forceRender() } handleResize(): void { @@ -328,6 +365,7 @@ class Load3d { this.renderer.setSize(width, height) this.previewManager.handleResize() + this.forceRender() } captureScene(width: number, height: number): Promise { diff --git a/src/extensions/core/load3d/Load3dAnimation.ts b/src/extensions/core/load3d/Load3dAnimation.ts index ecabc96e8..ddf7308c1 100644 --- a/src/extensions/core/load3d/Load3dAnimation.ts +++ b/src/extensions/core/load3d/Load3dAnimation.ts @@ -38,6 +38,10 @@ class Load3dAnimation extends Load3d { const animate = () => { this.animationFrameId = requestAnimationFrame(animate) + if (!this.isActive()) { + return + } + if (this.previewManager.showPreview) { this.previewManager.updatePreviewRender() }