diff --git a/src/views/trials/trials-panel/reading/dicoms3D/components/Viewport.vue b/src/views/trials/trials-panel/reading/dicoms3D/components/Viewport.vue index c84d2d5b..74b9adf3 100644 --- a/src/views/trials/trials-panel/reading/dicoms3D/components/Viewport.vue +++ b/src/views/trials/trials-panel/reading/dicoms3D/components/Viewport.vue @@ -151,7 +151,9 @@ export default { markers: { top: '', right: '', bottom: '', left: '' }, playClipState: false, wwwcIdx: 2, - loading: false + loading: false, + forceFitToWindow: false, + resizeObserver: null } }, mounted() { @@ -162,17 +164,26 @@ export default { this.initViewport() }) }, + beforeDestroy() { + if (this.resizeObserver && this.element) { + this.resizeObserver.unobserve(this.element) + this.resizeObserver.disconnect() + } + }, methods: { initViewport() { this.element = this.$refs['viewport'] - const resizeObserver = new ResizeObserver(() => { + this.resizeObserver = new ResizeObserver(() => { const renderingEngine = getRenderingEngine(this.renderingEngineId) if (renderingEngine) { - renderingEngine.resize(true, false) + renderingEngine.resize(true, true) + if (this.forceFitToWindow) { + this.resize(true) + } } }) this.element.oncontextmenu = (e) => e.preventDefault() - resizeObserver.observe(this.element) + this.resizeObserver.observe(this.element) this.element.addEventListener('CORNERSTONE_STACK_NEW_IMAGE', this.stackNewImage) // this.element.addEventListener('CORNERSTONE_VOI_MODIFIED', this.voiModified) // this.element.addEventListener('CORNERSTONE_CAMERA_MODIFIED', this.cameraModified) @@ -343,6 +354,7 @@ export default { viewport.render() }, resize(forceFitToWindow) { + this.forceFitToWindow = !!forceFitToWindow const renderingEngine = getRenderingEngine(this.renderingEngineId) const viewport = renderingEngine.getViewport(this.viewportId) if (!viewport) return