Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 32 additions & 4 deletions src/babylon/components/Scene.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
import React from 'react';
import BABYLON from 'babylonjs';
import DatasetParser from '../tools/data/DatasetParser';
import R16TextureParser from '../tools/data/R16TextureParser';
import RGBA8x512TextureParser from '../tools/data/RGBA8x512TextureParser';
import RGBA8x4TextureParser from '../tools/data/RGBA8x4TextureParser';
import fragmentShader from '../shaders/dvr.fragment.glsl';
import vertexShader from '../shaders/dvr.vertex.glsl';
import composeFragmentShader from '../shaders/compose.fragment.glsl';
Expand Down Expand Up @@ -29,8 +32,8 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
public gl: WebGL2RenderingContext;

private dataset = {
dimensions: new BABYLON.Vector3(256, 256, 256),
resolution: new BABYLON.Vector3(16.5, 16.5, 23.0),
dimensions: new BABYLON.Vector3(4096, 4096, 4096),
resolution: new BABYLON.Vector3(6, 6, 30.0),
};

public updateCamera(): void {
Expand Down Expand Up @@ -107,6 +110,15 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
frontplane.material = frontplaneMaterial;

// Textures + Framebuffers
const voxelCache = new BABYLON.Texture('datasets/Volume-cubey.512x512x512.uint16.raw', this.scene,
true, false, BABYLON.Texture.NEAREST_SAMPLINGMODE, undefined, undefined, undefined, false, undefined,
R16TextureParser);
const pageTable = new BABYLON.Texture('datasets/Volume-cubey.512x512x512.uint16.pagetable.16x32blk.raw',
this.scene, true, false, BABYLON.Texture.NEAREST_SAMPLINGMODE, undefined, undefined, undefined, false, undefined,
RGBA8x512TextureParser);
const pageDirectory = new BABYLON.Texture('datasets/Volume-cubey.512x512x512.uint16.pagedirectory.4x1.raw',
this.scene, true, false, BABYLON.Texture.NEAREST_SAMPLINGMODE, undefined, undefined, undefined, false, undefined,
RGBA8x4TextureParser);
const cubeTex = new BABYLON.Texture('datasets/e2198.raw', this.scene, true, false,
BABYLON.Texture.NEAREST_SAMPLINGMODE, undefined, undefined, undefined, false, undefined, DatasetParser);

Expand All @@ -121,6 +133,10 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
this.gl.activeTexture(this.gl.TEXTURE2);
const depthTex = this.createScreenTexture('segDepthTex', this.gl.RGBA32F, this.gl.RGBA, this.gl.FLOAT);

this.gl.activeTexture(this.gl.TEXTURE3);
const cacheStateTex = this.createScreenTexture(
'cacheStateTex', this.gl.RGBA32UI, this.gl.RGBA_INTEGER, this.gl.UNSIGNED_INT);

this.gl.activeTexture(this.gl.TEXTURE0);

const fb = segColorTex._texture._framebuffer;
Expand All @@ -130,8 +146,11 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
segIDTex._texture, 0);
this.gl.framebufferTexture2D(this.gl.FRAMEBUFFER, this.gl.COLOR_ATTACHMENT2, this.gl.TEXTURE_2D,
depthTex._texture, 0);
this.gl.framebufferTexture2D(this.gl.FRAMEBUFFER, this.gl.COLOR_ATTACHMENT3, this.gl.TEXTURE_2D,
cacheStateTex._texture, 0);

this.gl.drawBuffers([this.gl.COLOR_ATTACHMENT0, this.gl.COLOR_ATTACHMENT1, this.gl.COLOR_ATTACHMENT2]);
this.gl.drawBuffers([
this.gl.COLOR_ATTACHMENT0, this.gl.COLOR_ATTACHMENT1, this.gl.COLOR_ATTACHMENT2, this.gl.COLOR_ATTACHMENT3]);

if (this.gl.checkFramebufferStatus(this.gl.FRAMEBUFFER) !== this.gl.FRAMEBUFFER_COMPLETE) {
console.error('Framebuffer creation failed!');
Expand All @@ -143,6 +162,7 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
this.gl.clearBufferfv(this.gl.COLOR, 0, [0.2, 0.2, 0.3, 1.0]); // segColorTex (Segment Color)
this.gl.clearBufferuiv(this.gl.COLOR, 1, [0, 0, 0, 0]); // segIDTex (Segment ID)
this.gl.clearBufferfv(this.gl.COLOR, 2, [0.0, 0.0, 0.0, 0.0]); // depthTex (Segment Depth)
this.gl.clearBufferuiv(this.gl.COLOR, 3, [0, 0, 0, 0]); // cacheStateTex (miss/empty)
};

this.scene.customRenderTargets.push(segColorTex);
Expand All @@ -152,17 +172,24 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
frontplaneMaterial.setVector3('distortionCorrection', distort);
frontplaneMaterial.setFloat('fovy', this.camera.fov);
frontplaneMaterial.setTexture('cubeTex', cubeTex);
frontplaneMaterial.setTexture('voxelCache', voxelCache);
frontplaneMaterial.setTexture('pageTable', pageTable);
frontplaneMaterial.setTexture('pageDirectory', pageDirectory);

// Post Processes
shaderStore.composePixelShader = composeFragmentShader.trim();
const postProcess = new BABYLON.PostProcess('compose', 'compose', [], ['segColorTex', 'segIDTex', 'segDepthTex'],
const postProcess = new BABYLON.PostProcess('compose', 'compose', [],
['segColorTex', 'segIDTex', 'segDepthTex', 'cacheStateTex'],
1.0, this.camera, BABYLON.Texture.NEAREST_SAMPLINGMODE, this.engine, true);

postProcess.onApply = (effect) => {
effect.setTexture('segColorTex', segColorTex);
effect.setTexture('segIDTex', segIDTex);
effect.setTexture('segDepthTex', depthTex);
effect.setTexture('cacheStateTex', cacheStateTex);
};


}

public componentWillUnmount() {
Expand All @@ -172,6 +199,7 @@ export default class Scene extends React.Component<SceneProps, SceneState> {
this.engine.scenes[0].dispose();
}
}
this.engine.wipeCaches();
this.engine.dispose();
}

Expand Down
9 changes: 7 additions & 2 deletions src/babylon/shaders/compose.fragment.glsl
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,20 @@ in vec2 vUV;
uniform sampler2D segColorTex;
uniform usampler2D segIDTex;
uniform sampler2D segDepthTex;
uniform usampler2D cacheStateTex;

//out vec4 glFragColor;

void main(void) {

glFragColor.rgb = vec3(texture(segColorTex, vUV).rgb);
//glFragColor.rgb = vec3(texture(segIDTex, vUV).r);
//glFragColor.rgb = vec3(texture(segDepthTex, vUV).r) / 10.0;
glFragColor.rgb = vec3(texture(segDepthTex, vUV).r) / 10.0;
glFragColor.rgb = vec3(texture(cacheStateTex, vUV).rgb) ;
/*
*glFragColor.rgb = vec3(texture(segDepthTex, vUV).r) / 10.0;
*glFragColor.rgb = vec3(texture(segIDTex, vUV).r) / 65336.0;
*/

glFragColor.a = 1.0;

}
Loading