Hi Guys, I am doing something like three.js examples, I tried to use different colormap to display some dynamic animation. so I just change the colormap picture from gray to mix:
the gray colormap:
the mixed:
When I try to change the colormap I find that the translucency effect seems to be lost:
When I placed the “spine” in the front, the green bracket part at the back was too obvious, making the whole picture lose its sense of hierarchy. Should I adjust my colormap or do something else?
You might need alpha in your colormap also?
1 Like
Hi manthrax. I read the picture with python, only find three channel…
Ahh good catch.
Ooof ok I looked at the actual shader: three.js/examples/jsm/shaders/VolumeShader.js at 2ff77e4b335e31c108aac839a07401664998c730 · mrdoob/three.js · GitHub
And it’s more complicated than I thought. The transparency is always .5, and just the color is selected by density. so you might have to hack/modify the shaders “apply_colormap” function:
vec4 apply_colormap(float val) {
val = (val - u_clim[0]) / (u_clim[1] - u_clim[0]);
return texture2D(u_cmdata, vec2(val, 0.5));
}
so make a local copy of that shader and experiment with changing apply_colormap?
I just copy the ‘fragmentShader.js’ and modify the code:
and I replace the colormap to origin gray, it still looks wird…
vec4 apply_colormap(float val) {
val = (val - u_clim[0]) / (u_clim[1] - u_clim[0]);
float trans = 0.5;
if(val>0.5) {
trans = 0.1;
}
return texture2D(u_cmdata, vec2(val, trans));
}
this picture is what I am working on. it looks still have no sense of hierarchy
