diff --git a/src/display_context.ts b/src/display_context.ts index b15d64a68f..615e5b97ce 100644 --- a/src/display_context.ts +++ b/src/display_context.ts @@ -276,6 +276,37 @@ export abstract class RenderedPanel extends RefCounted { gl.scissor(canvasRelativeClippedLeft, glBottom, width, height); } + setSubdividedGLClippedViewport(cellIndex: number, totalCells: number) { + const { + gl, + canvasRelativeClippedTop, + canvasRelativeClippedLeft, + renderViewport: { width, height }, + } = this; + + const numCols = Math.ceil(Math.sqrt(totalCells)); + const numRows = Math.ceil(totalCells / numCols); + + const col = cellIndex % numCols; + const row = Math.floor(cellIndex / numCols); + + const cellWidth = width / numCols; + const cellHeight = height / numRows; + + const left = canvasRelativeClippedLeft + col * cellWidth; + const top = canvasRelativeClippedTop + row * cellHeight; + const bottom = top + cellHeight; + + const glLeft = Math.floor(left); + const glBottom = Math.floor(this.context.canvas.height - bottom); + const glWidth = Math.ceil(cellWidth); + const glHeight = Math.ceil(cellHeight); + + gl.enable(WebGL2RenderingContext.SCISSOR_TEST); + gl.viewport(glLeft, glBottom, glWidth, glHeight); + gl.scissor(glLeft, glBottom, glWidth, glHeight); + } + // Sets the viewport to the logical viewport, using the scissor test to constrain drawing to the // clipped viewport. Drawing does not need to take `visible{Left,Top,Width,Height}Fraction` into // account. diff --git a/src/perspective_view/panel.ts b/src/perspective_view/panel.ts index 7b062b436c..af6113ecd5 100644 --- a/src/perspective_view/panel.ts +++ b/src/perspective_view/panel.ts @@ -83,6 +83,12 @@ import { MultipleScaleBarTextures } from "#src/widget/scale_bar.js"; import type { RPC } from "#src/worker_rpc.js"; import { SharedObject } from "#src/worker_rpc.js"; +// Turn on to see each of the offscreen textures +// render order is from top left to bottom right +// picking will not work as expected in a subdivision +// of the full panel, pretend you are picking from the full panel +const DEBUG_OFFSCREEN_TEXTURES = false; + export interface PerspectiveViewerState extends RenderedDataViewerState { wireFrame: WatchableValueInterface; enableAdaptiveDownsampling: WatchableValueInterface; @@ -1419,6 +1425,17 @@ export class PerspectivePanel extends RenderedDataPanel { } this.offscreenFramebuffer.unbind(); + if (DEBUG_OFFSCREEN_TEXTURES) { + const numTextures = OffscreenTextures.NUM_TEXTURES; + for (let i = 0; i < numTextures; i++) { + const texture = this.offscreenFramebuffer.colorBuffers[i].texture; + if (texture) { + this.setSubdividedGLClippedViewport(i, numTextures); + this.offscreenCopyHelper.draw(texture); + } + } + return true; + } // Draw the texture over the whole viewport. this.setGLClippedViewport(); this.offscreenCopyHelper.draw( diff --git a/src/sliceview/panel.ts b/src/sliceview/panel.ts index fe616f185d..c21edc6105 100644 --- a/src/sliceview/panel.ts +++ b/src/sliceview/panel.ts @@ -59,6 +59,12 @@ import type { ShaderBuilder } from "#src/webgl/shader.js"; import type { TrackableScaleBarOptions } from "#src/widget/scale_bar.js"; import { MultipleScaleBarTextures } from "#src/widget/scale_bar.js"; +// Turn on to see each of the offscreen textures +// render order is from top left to bottom right +// picking will not work as expected in a subdivision +// of the full panel, pretend you are picking from the full panel +const DEBUG_OFFSCREEN_TEXTURES = false; + export interface SliceViewerState extends RenderedDataViewerState { showScaleBar: TrackableBoolean; wireFrame: TrackableBoolean; @@ -431,9 +437,19 @@ export class SliceViewPanel extends RenderedDataPanel { gl.disable(WebGL2RenderingContext.BLEND); } } - this.offscreenFramebuffer.unbind(); + if (DEBUG_OFFSCREEN_TEXTURES) { + const numTextures = OffscreenTextures.NUM_TEXTURES; + for (let i = 0; i < numTextures; i++) { + const texture = this.offscreenFramebuffer.colorBuffers[i].texture; + if (texture) { + this.setSubdividedGLClippedViewport(i, numTextures); + this.offscreenCopyHelper.draw(texture); + } + } + return true; + } // Draw the texture over the whole viewport. this.setGLClippedViewport(); this.offscreenCopyHelper.draw(