BufferAttribute.html 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
  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. <h1>[name]</h1>
  11. <p class="desc">
  12. 这个类用于存储与[page:BufferGeometry]相关联的 attribute(例如顶点位置向量,面片索引,法向量,颜色值,UV坐标以及任何自定义 attribute )。
  13. 利用 BufferAttribute,可以更高效的向GPU传递数据。详情和例子见该页。<br /><br />
  14. 在 BufferAttribute 中,数据被存储为任意长度的矢量(通过[page:BufferAttribute.itemSize itemSize]进行定义),下列函数如无特别说明,
  15. 函数参数中的index会自动乘以矢量长度进行计算。
  16. 当想要处理类似向量的数据时,
  17. 可以使用在[page:Vector2.fromBufferAttribute Vector2],[page:Vector3.fromBufferAttribute Vector3],
  18. [page:Vector4.fromBufferAttribute Vector4]以及[page:Color.fromBufferAttribute Color]这些类中的<i>.fromBufferAttribute( attribute, index )</i>
  19. 方法来更为便捷地处理。
  20. </p>
  21. <h2>构造函数</h2>
  22. <h3>[name]( [param:TypedArray array], [param:Integer itemSize], [param:Boolean normalized] )</h3>
  23. <p>
  24. [page:TypedArray array] -- 必须是 [link:https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/TypedArray TypedArray].
  25. 类型,用于实例化缓存。<br />
  26. 该队列应该包含:
  27. <code>itemSize * numVertices</code>
  28. 个元素,numVertices 是 [page:BufferGeometry BufferGeometry]中的顶点数目<br /><br />
  29. [page:Integer itemSize] --
  30. 队列中与顶点相关的数据值的大小。举例,如果 attribute 存储的是三元组(例如顶点空间坐标、法向量或颜色值)则itemSize的值应该是3。
  31. <br /><br />
  32. [page:Boolean normalized] -- (可选) 指明缓存中的数据如何与GLSL代码中的数据对应。例如,如果[page:TypedArray array]是
  33. UInt16Array类型,且[page:Boolean normalized]的值是 true,则队列中的值将会从 0 - +65535 映射为 GLSL 中的 0.0f - +1.0f。
  34. 如果[page:TypedArray array]是 Int16Array (有符号),则值将会从 -32768 - +32767 映射为 -1.0f - +1.0f。若 [page:Boolean normalized]
  35. 的值为 false,则数据映射不会归一化,而会直接映射为 float 值,例如,32767 将会映射为 32767.0f.
  36. </p>
  37. <h2>属性</h2>
  38. <h3>[property:TypedArray array]</h3>
  39. <p>
  40. 在 [page:TypedArray array] 中保存着缓存中的数据。
  41. </p>
  42. <h3>[property:Integer count]</h3>
  43. <p>
  44. 保存 [page:BufferAttribute.array array] 除以 [page:BufferAttribute.itemSize itemSize] 之后的大小。Read-only property.<br /><br />
  45. 若缓存存储三元组(例如顶点位置、法向量、颜色值),则该值应等于队列中三元组的个数。
  46. </p>
  47. <h3>[property:Number gpuType]</h3>
  48. <p>
  49. Configures the bound GPU type for use in shaders. Either [page:BufferAttribute THREE.FloatType] or [page:BufferAttribute THREE.IntType], default is [page:BufferAttribute THREE.FloatType].
  50. Note: this only has an effect for integer arrays and is not configurable for float arrays. For lower precision float types, see [page:BufferAttributeTypes THREE.Float16BufferAttribute].
  51. </p>
  52. <h3>[property:Boolean isBufferAttribute]</h3>
  53. <p>
  54. 用于判断对象是否为[name]类型的只读标记.
  55. </p>
  56. <h3>[property:Integer itemSize]</h3>
  57. <p>保存在 [page:BufferAttribute.array array] 中矢量的长度。</p>
  58. <h3>[property:String name]</h3>
  59. <p>
  60. 该 attribute 实例的别名,默认值为空字符串。
  61. </p>
  62. <h3>[property:Boolean needsUpdate]</h3>
  63. <p>
  64. 该标志位指明当前 attribute 已经被修改过,且需要再次送入 GPU 处理。当开发者改变了该队列的值,则标志位需要设置为 true。<br /><br />
  65. 将标志位设为 true 同样会增加 [page:BufferAttribute.version version] 的值。
  66. </p>
  67. <h3>[property:Boolean normalized]</h3>
  68. <p>
  69. 指明缓存中数据在转化为GLSL着色器代码中数据时是否需要被归一化。详见构造函数中的说明。
  70. </p>
  71. <h3>[property:Function onUploadCallback]</h3>
  72. <p>
  73. attribute 数据传输到GPU后的回调函数。
  74. </p>
  75. <h3>[property:Object updateRange]</h3>
  76. <p>对象包含如下成员:<br />
  77. [page:Integer offset]: 默认值为 *0*。 指明更新的起始位置。<br />
  78. [page:Integer count]: 默认值为 *-1*,表示不指定更新范围。<br /><br />
  79. 该值只可以被用于更新某些矢量数据(例如,颜色相关数据)。
  80. </p>
  81. <h3>[property:Usage usage]</h3>
  82. <p>
  83. 为输入的数据定义最优的预估使用方式。等同于在[link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bufferData WebGLRenderingContext.bufferData]()
  84. 中的*usage*参数。默认为[page:BufferAttributeUsage StaticDrawUsage]。在usage [page:BufferAttributeUsage constants]中查看可用值。
  85. </p>
  86. <h3>[property:Integer version]</h3>
  87. <p>版本号,当 [page:BufferAttribute.needsUpdate needsUpdate] 被设置为 true 时,该值会自增。</p>
  88. <h2>方法</h2>
  89. <h3>[method:this applyMatrix3]( [param:Matrix3 m] )</h3>
  90. <p>将矩阵[page:Matrix3 m]应用此BufferAttribute中的每一个Vector3元素中。</p>
  91. <h3>[method:this applyMatrix4]( [param:Matrix4 m] )</h3>
  92. <p>将矩阵[page:Matrix4 m]应用到此BufferAttribute的每一个Vector3元素中</p>
  93. <h3>[method:this applyNormalMatrix]( [param:Matrix3 m] )</h3>
  94. <p>将正规矩阵[page:Matrix3 m]应用到此BufferAttribute的每一个Vector3元素中</p>
  95. <h3>[method:this transformDirection]( [param:Matrix4 m] )</h3>
  96. <p>将矩阵[page:Matrix4 m]应用到此BufferAttribute的每一个Vector3元素中,并将所有元素解释为方向向量。</p>
  97. <h3>[method:BufferAttribute clone]() </h3>
  98. <p>返回该 BufferAttribute 的拷贝。</p>
  99. <h3>[method:this copyArray]( array ) </h3>
  100. <p>将参数中所给定的普通队列或 TypedArray 拷贝到 [page:BufferAttribute.array array] 中。<br /><br />
  101. 拷贝 TypedArray 相关注意事项详见 [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/set TypedArray.set]。
  102. </p>
  103. <h3>[method:this copyAt] ( [param:Integer index1], [param:BufferAttribute bufferAttribute], [param:Integer index2] ) </h3>
  104. <p>将一个矢量从 bufferAttribute[index2] 拷贝到 [page:BufferAttribute.array array][index1] 中。</p>
  105. <h3>[method:Number getComponent]( [param:Integer index], [param:Integer component] ) </h3>
  106. <p>Returns the given component of the vector at the given index.</p>
  107. <h3>[method:Number getX]( [param:Integer index] ) </h3>
  108. <p>获取给定索引的矢量的第一维元素 (即 X 值)。</p>
  109. <h3>[method:Number getY]( [param:Integer index] ) </h3>
  110. <p>获取给定索引的矢量的第二维元素 (即 Y 值)。</p>
  111. <h3>[method:Number getZ]( [param:Integer index] ) </h3>
  112. <p>获取给定索引的矢量的第三维元素 (即 Z 值)。</p>
  113. <h3>[method:Number getW]( [param:Integer index] ) </h3>
  114. <p>获取给定索引的矢量的第四维元素 (即 W 值)。</p>
  115. <h3>[method:this onUpload]( [param:Function callback] ) </h3>
  116. <p>见 onUploadCallback 属性。<br /><br />
  117. 在 [example:webgl_buffergeometry WebGL / Buffergeometry] 中,该方在缓存数据传递给 GPU 后,用于释放内存。
  118. </p>
  119. <h3>[method:this set] ( [param:Array value], [param:Integer offset] ) </h3>
  120. <p>
  121. value -- 被拷贝的 [page:Array] 或 [page:TypedArray] 类型的数据。 <br />
  122. offset -- (可选) [page:BufferAttribute.array array] 中开始拷贝的位置索引。<br /><br />
  123. 对 [page:BufferAttribute.array array],调用 [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/set TypedArray.set]( [page:Array value], [page:Integer offset] )
  124. 方法。<br /><br />
  125. 特别的, 对将 [page:Array value] 转为 [page:TypedArray] 的要求详见上述链接。
  126. </p>
  127. <h3>[method:this setUsage] ( [param:Usage value] ) </h3>
  128. <p>Set [page:BufferAttribute.usage usage] to value. See usage [page:BufferAttributeUsage constants] for all possible input values.</p>
  129. <h3>[method:Number setComponent]( [param:Integer index], [param:Integer component], [param:Float value] ) </h3>
  130. <p>Sets the given component of the vector at the given index.</p>
  131. <h3>[method:this setX]( [param:Integer index], [param:Float x] ) </h3>
  132. <p>设置给定索引的矢量的第一维数据(设置 X 值)。</p>
  133. <h3>[method:this setY]( [param:Integer index], [param:Float y] ) </h3>
  134. <p>设置给定索引的矢量的第二维数据(设置 Y 值)。</p>
  135. <h3>[method:this setZ]( [param:Integer index], [param:Float z] ) </h3>
  136. <p>设置给定索引的矢量的第三维数据(设置 Z 值)。</p>
  137. <h3>[method:this setW]( [param:Integer index], [param:Float w] ) </h3>
  138. <p>设置给定索引的矢量的第四维数据(设置 W 值)。</p>
  139. <h3>[method:this setXY]( [param:Integer index], [param:Float x], [param:Float y] ) </h3>
  140. <p>设置给定索引的矢量的第一、二维数据(设置 X 和 Y 值)。</p>
  141. <h3>[method:this setXYZ]( [param:Integer index], [param:Float x], [param:Float y], [param:Float z] ) </h3>
  142. <p>设置给定索引的矢量的第一、二、三维数据(设置 X、Y 和 Z 值)。</p>
  143. <h3>[method:this setXYZW]( [param:Integer index], [param:Float x], [param:Float y], [param:Float z], [param:Float w] ) </h3>
  144. <p>设置给定索引的矢量的第一、二、三、四维数据(设置 X、Y、Z 和 W 值)。</p>
  145. <h2>源代码</h2>
  146. <p>
  147. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  148. </p>
  149. </body>
  150. </html>