Hey,
we are trying to render a large volume by rendering multiple smaller volume blocks.
A 1024x1024x1024 volume would be rendered using 64 256x256x256 blocks. We encountered two issues and are out of ideas.
The first issue is when rendering using ShaderMaterial with
let material = new ShaderMaterial({
uniforms: uniforms,
vertexShader: this.shader.vertexShader,
fragmentShader: this.shader.fragmentShader,
side: BackSide, // The volume shader uses the backface as its “reference point”
transparent: true, // otherwise we do not blend between blocks
depthTest: false,
depthWrite: false,
});
the order of rendering seems to be wrong in some camera perspectives.
this is the right rendering order
and when moving the camera just a little, the wrong rendering order
What can we do about this?
The second issue, when rendering using AdditiveBlending
let material = new ShaderMaterial({
uniforms: uniforms,
vertexShader: this.shader.vertexShader,
fragmentShader: this.shader.fragmentShader,
side: BackSide, // The volume shader uses the backface as its “reference point”
transparent: false,
depthTest: false,
depthWrite: true,
premultipliedAlpha: true,
blending: AdditiveBlending,
});
is that the rendering at the edges of a block create a bright color, the voxels/textures do not overlap, so we dont understand why theres a color gradient at the edge
How can we prevent this from happening?
The shader code used for both problems is the same and is a standard raytracing approach.
Thanks!
Willi