VolumeShader.js 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285
  1. import {
  2. Vector2,
  3. Vector3
  4. } from 'three';
  5. /**
  6. * @module VolumeShader
  7. * @three_import import { VolumeRenderShader1 } from 'three/addons/shaders/VolumeShader.js';
  8. */
  9. /**
  10. * Shaders to render 3D volumes using raycasting.
  11. * The applied techniques are based on similar implementations in the Visvis and Vispy projects.
  12. * This is not the only approach, therefore it's marked 1.
  13. *
  14. * @constant
  15. * @type {ShaderMaterial~Shader}
  16. */
  17. const VolumeRenderShader1 = {
  18. name: 'VolumeRenderShader1',
  19. uniforms: {
  20. 'u_size': { value: new Vector3( 1, 1, 1 ) },
  21. 'u_renderstyle': { value: 0 },
  22. 'u_renderthreshold': { value: 0.5 },
  23. 'u_clim': { value: new Vector2( 1, 1 ) },
  24. 'u_data': { value: null },
  25. 'u_cmdata': { value: null }
  26. },
  27. vertexShader: /* glsl */`
  28. varying vec3 v_position;
  29. varying vec3 v_cameraInObj;
  30. varying vec3 v_viewDirInObj;
  31. void main() {
  32. vec4 position4 = vec4(position, 1.0);
  33. v_position = position;
  34. // Express the camera position and view direction in the object's local
  35. // space so the fragment shader can build the per-fragment view ray.
  36. // For perspective cameras, rays converge at v_cameraInObj.
  37. // For orthographic cameras, rays travel along v_viewDirInObj.
  38. v_cameraInObj = (inverse(modelMatrix) * vec4(cameraPosition, 1.0)).xyz;
  39. v_viewDirInObj = (inverse(modelViewMatrix) * vec4(0.0, 0.0, -1.0, 0.0)).xyz;
  40. gl_Position = projectionMatrix * modelViewMatrix * position4;
  41. }`,
  42. fragmentShader: /* glsl */`
  43. precision highp float;
  44. precision mediump sampler3D;
  45. uniform vec3 u_size;
  46. uniform int u_renderstyle;
  47. uniform float u_renderthreshold;
  48. uniform vec2 u_clim;
  49. uniform sampler3D u_data;
  50. uniform sampler2D u_cmdata;
  51. varying vec3 v_position;
  52. varying vec3 v_cameraInObj;
  53. varying vec3 v_viewDirInObj;
  54. // The maximum distance through our rendering volume is sqrt(3).
  55. const int MAX_STEPS = 887; // 887 for 512^3, 1774 for 1024^3
  56. const int REFINEMENT_STEPS = 4;
  57. const float relative_step_size = 1.0;
  58. const vec4 ambient_color = vec4(0.2, 0.4, 0.2, 1.0);
  59. const vec4 diffuse_color = vec4(0.8, 0.2, 0.2, 1.0);
  60. const vec4 specular_color = vec4(1.0, 1.0, 1.0, 1.0);
  61. const float shininess = 40.0;
  62. void cast_mip(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray);
  63. void cast_iso(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray);
  64. float sample1(vec3 texcoords);
  65. vec4 apply_colormap(float val);
  66. vec4 add_lighting(float val, vec3 loc, vec3 step, vec3 view_ray);
  67. void main() {
  68. // Per-fragment ray direction in object space, pointing from the back
  69. // face toward the camera. For perspective cameras the rays converge
  70. // at the camera position; for orthographic cameras they are parallel
  71. // to the view direction.
  72. vec3 view_ray = isOrthographic
  73. ? normalize(-v_viewDirInObj)
  74. : normalize(v_cameraInObj - v_position);
  75. // Slab-based ray/AABB intersection: v_position lies on the back face
  76. // of the cuboid, so stepping along view_ray traverses the volume and
  77. // exits through the front face at t = distance.
  78. vec3 t1 = (vec3(-0.5) - v_position) / view_ray;
  79. vec3 t2 = (u_size - vec3(0.5) - v_position) / view_ray;
  80. vec3 tmax = max(t1, t2);
  81. float distance = min(min(tmax.x, tmax.y), tmax.z);
  82. // Decide how many steps to take
  83. int nsteps = int(distance / relative_step_size + 0.5);
  84. if ( nsteps < 1 )
  85. discard;
  86. // Get starting location and step vector in texture coordinates
  87. vec3 front = v_position + view_ray * distance;
  88. vec3 step = ((v_position - front) / u_size) / float(nsteps);
  89. vec3 start_loc = front / u_size;
  90. // For testing: show the number of steps. This helps to establish
  91. // whether the rays are correctly oriented
  92. //'gl_FragColor = vec4(0.0, float(nsteps) / 1.0 / u_size.x, 1.0, 1.0);
  93. //'return;
  94. if (u_renderstyle == 0)
  95. cast_mip(start_loc, step, nsteps, view_ray);
  96. else if (u_renderstyle == 1)
  97. cast_iso(start_loc, step, nsteps, view_ray);
  98. if (gl_FragColor.a < 0.05)
  99. discard;
  100. }
  101. float sample1(vec3 texcoords) {
  102. /* Sample float value from a 3D texture. Assumes intensity data. */
  103. return texture(u_data, texcoords.xyz).r;
  104. }
  105. vec4 apply_colormap(float val) {
  106. val = (val - u_clim[0]) / (u_clim[1] - u_clim[0]);
  107. float n = float(textureSize(u_cmdata, 0).x); // see #33842
  108. val = (val * (n - 1.0) + 0.5) / n;
  109. return texture2D(u_cmdata, vec2(val, 0.5));
  110. }
  111. void cast_mip(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray) {
  112. float max_val = -1e6;
  113. int max_i = 100;
  114. vec3 loc = start_loc;
  115. // Enter the raycasting loop. In WebGL 1 the loop index cannot be compared with
  116. // non-constant expression. So we use a hard-coded max, and an additional condition
  117. // inside the loop.
  118. for (int iter=0; iter<MAX_STEPS; iter++) {
  119. if (iter >= nsteps)
  120. break;
  121. // Sample from the 3D texture
  122. float val = sample1(loc);
  123. // Apply MIP operation
  124. if (val > max_val) {
  125. max_val = val;
  126. max_i = iter;
  127. }
  128. // Advance location deeper into the volume
  129. loc += step;
  130. }
  131. // Refine location, gives crispier images
  132. vec3 iloc = start_loc + step * (float(max_i) - 0.5);
  133. vec3 istep = step / float(REFINEMENT_STEPS);
  134. for (int i=0; i<REFINEMENT_STEPS; i++) {
  135. max_val = max(max_val, sample1(iloc));
  136. iloc += istep;
  137. }
  138. // Resolve final color
  139. gl_FragColor = apply_colormap(max_val);
  140. }
  141. void cast_iso(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray) {
  142. gl_FragColor = vec4(0.0); // init transparent
  143. vec4 color3 = vec4(0.0); // final color
  144. vec3 dstep = 1.5 / u_size; // step to sample derivative
  145. vec3 loc = start_loc;
  146. float low_threshold = u_renderthreshold - 0.02 * (u_clim[1] - u_clim[0]);
  147. // Enter the raycasting loop. In WebGL 1 the loop index cannot be compared with
  148. // non-constant expression. So we use a hard-coded max, and an additional condition
  149. // inside the loop.
  150. for (int iter=0; iter<MAX_STEPS; iter++) {
  151. if (iter >= nsteps)
  152. break;
  153. // Sample from the 3D texture
  154. float val = sample1(loc);
  155. if (val > low_threshold) {
  156. // Take the last interval in smaller steps
  157. vec3 iloc = loc - 0.5 * step;
  158. vec3 istep = step / float(REFINEMENT_STEPS);
  159. for (int i=0; i<REFINEMENT_STEPS; i++) {
  160. val = sample1(iloc);
  161. if (val > u_renderthreshold) {
  162. gl_FragColor = add_lighting(val, iloc, dstep, view_ray);
  163. return;
  164. }
  165. iloc += istep;
  166. }
  167. }
  168. // Advance location deeper into the volume
  169. loc += step;
  170. }
  171. }
  172. vec4 add_lighting(float val, vec3 loc, vec3 step, vec3 view_ray)
  173. {
  174. // Calculate color by incorporating lighting
  175. // View direction
  176. vec3 V = normalize(view_ray);
  177. // calculate normal vector from gradient
  178. vec3 N;
  179. float val1, val2;
  180. val1 = sample1(loc + vec3(-step[0], 0.0, 0.0));
  181. val2 = sample1(loc + vec3(+step[0], 0.0, 0.0));
  182. N[0] = val1 - val2;
  183. val = max(max(val1, val2), val);
  184. val1 = sample1(loc + vec3(0.0, -step[1], 0.0));
  185. val2 = sample1(loc + vec3(0.0, +step[1], 0.0));
  186. N[1] = val1 - val2;
  187. val = max(max(val1, val2), val);
  188. val1 = sample1(loc + vec3(0.0, 0.0, -step[2]));
  189. val2 = sample1(loc + vec3(0.0, 0.0, +step[2]));
  190. N[2] = val1 - val2;
  191. val = max(max(val1, val2), val);
  192. float gm = length(N); // gradient magnitude
  193. N = normalize(N);
  194. // Flip normal so it points towards viewer
  195. float Nselect = float(dot(N, V) > 0.0);
  196. N = (2.0 * Nselect - 1.0) * N; // == Nselect * N - (1.0-Nselect)*N;
  197. // Init colors
  198. vec4 ambient_color = vec4(0.0, 0.0, 0.0, 0.0);
  199. vec4 diffuse_color = vec4(0.0, 0.0, 0.0, 0.0);
  200. vec4 specular_color = vec4(0.0, 0.0, 0.0, 0.0);
  201. // note: could allow multiple lights
  202. for (int i=0; i<1; i++)
  203. {
  204. // Get light direction (make sure to prevent zero division)
  205. vec3 L = normalize(view_ray); //lightDirs[i];
  206. float lightEnabled = float( length(L) > 0.0 );
  207. L = normalize(L + (1.0 - lightEnabled));
  208. // Calculate lighting properties
  209. float lambertTerm = clamp(dot(N, L), 0.0, 1.0);
  210. vec3 H = normalize(L+V); // Halfway vector
  211. float specularTerm = pow(max(dot(H, N), 0.0), shininess);
  212. // Calculate mask
  213. float mask1 = lightEnabled;
  214. // Calculate colors
  215. ambient_color += mask1 * ambient_color; // * gl_LightSource[i].ambient;
  216. diffuse_color += mask1 * lambertTerm;
  217. specular_color += mask1 * specularTerm * specular_color;
  218. }
  219. // Calculate final color by componing different components
  220. vec4 final_color;
  221. vec4 color = apply_colormap(val);
  222. final_color = color * (ambient_color + diffuse_color) + specular_color;
  223. final_color.a = color.a;
  224. return final_color;
  225. }`
  226. };
  227. export { VolumeRenderShader1 };
粤ICP备19079148号