Data3DTexture.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../../" />
  6. <script src="page.js"></script>
  7. <link type="text/css" rel="stylesheet" href="page.css" />
  8. </head>
  9. <body>
  10. [page:Texture] &rarr;
  11. <h1>三维数据纹理([name])</h1>
  12. <p class="desc">创建一个三维的纹理贴图。</p>
  13. <h2>构造函数</h2>
  14. <h3>[name]( [param:TypedArray data], [param:Number width], [param:Number height], [param:Number depth] )</h3>
  15. <p>
  16. [page:Object data] -- 纹理的数据。<br />
  17. [page:Number width] -- 纹理的宽度。<br />
  18. [page:Number height] -- 纹理的高度。<br />
  19. [page:Number depth] -- 纹理的深度。
  20. </p>
  21. <h2>代码示例</h2>
  22. <p>这将创建一个具有重复数据(0 到 255)的 [name]。</p>
  23. <code>
  24. // create a buffer with some data
  25. const sizeX = 64;
  26. const sizeY = 64;
  27. const sizeZ = 64;
  28. const data = new Uint8Array( sizeX * sizeY * sizeZ );
  29. let i = 0;
  30. for ( let z = 0; z < sizeZ; z ++ ) {
  31. for ( let y = 0; y < sizeY; y ++ ) {
  32. for ( let x = 0; x < sizeX; x ++ ) {
  33. data[ i ] = i % 256;
  34. i ++;
  35. }
  36. }
  37. }
  38. // use the buffer to create the texture
  39. const texture = new THREE.Data3DTexture( data, sizeX, sizeY, sizeZ );
  40. texture.needsUpdate = true;
  41. </code>
  42. <h2>例子</h2>
  43. <p>
  44. [example:webgl_texture3d WebGL / texture3d]<br />
  45. [example:webgl_texture3d_partialupdate WebGL / texture3d / partialupdate]<br />
  46. [example:webgl_volume_cloud WebGL / volume / cloud]<br />
  47. [example:webgl_volume_perlin WebGL / volume / perlin]
  48. </p>
  49. <h2>属性</h2>
  50. <p>
  51. 共有属性请参见其基类[page:Texture Texture]。
  52. </p>
  53. <h3>[property:Boolean flipY]</h3>
  54. <p>
  55. 如果设置为 *true*,纹理在上传到 GPU 时会被垂直翻转。默认值为 *false*。
  56. </p>
  57. <h3>[property:Boolean generateMipmaps]</h3>
  58. <p>
  59. 是否为纹理生成 mipmap(如果可能)。默认为 `false`。
  60. </p>
  61. <h3>[property:Image image]</h3>
  62. <p>
  63. 用包含宽度、高度和深度的对象覆盖。
  64. </p>
  65. <h3>[property:Boolean isData3DTexture]</h3>
  66. <p>只读属性,用于检查给定对象是否为 [name] 类型。</p>
  67. <h3>[property:number magFilter]</h3>
  68. <p>
  69. 当一个纹素覆盖多个像素时,纹理的采样方式。默认值为 [page:Textures THREE.NearestFilter],即使用最接近的纹素的值。
  70. <br /><br />
  71. 有关详细信息,请参阅 [page:Textures texture constants]。
  72. </p>
  73. <h3>[property:number minFilter]</h3>
  74. <p>
  75. 当纹素覆盖不到一个像素时,纹理的采样方式。默认值为 [page:Textures THREE.NearestFilter],即使用最接近的纹素的值。<br /><br />
  76. 有关详细信息,请参阅 [page:Textures texture constants]。
  77. </p>
  78. <h3>[property:number unpackAlignment]</h3>
  79. <p>
  80. 默认值为 `1`。 指定内存中每个像素行起始处的对齐要求。
  81. 允许的值为 1(字节对齐)、2(行与偶数字节对齐)、4(字对齐)和 8(行从双字边界开始)。
  82. 有关详细信息,请参阅 [link:https://registry.khronos.org/OpenGL-Refpages/es3.0/html/glPixelStorei.xhtml glPixelStorei]。
  83. </p>
  84. <h3>[property:number wrapR]</h3>
  85. <p>
  86. 这定义了纹理在深度方向上的包裹方式。<br />
  87. 默认值为 [page:Textures THREE.ClampToEdgeWrapping],其中边缘被紧贴到外边缘纹素上。
  88. 另外两个选择是 [page:Textures THREE.RepeatWrapping] 和 [page:Textures THREE.MirroredRepeatWrapping]。
  89. 有关详细信息,请参阅 [page:Textures texture constants] 页面。
  90. </p>
  91. <h2>方法</h2>
  92. <p>
  93. 共有方法请参见其基类[page:Texture Texture]。
  94. </p>
  95. <h2>源代码</h2>
  96. <p>
  97. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  98. </p>
  99. </body>
  100. </html>
粤ICP备19079148号