BatchedMesh.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319
  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:Mesh] &rarr;
  11. <h1>批处理网格([name])</h1>
  12. <p class="desc">
  13. [page:Mesh] 的特殊版本,支持多绘制批量渲染。如果您必须渲染大量具有相同材质但具有不同世界变换和几何形状的对象,请使用 [name]。使用 [name] 将帮助您减少绘制调用的数量,从而提高应用程序的整体渲染性能。
  14. <br />
  15. <br />
  16. 如果不支持 [link:https://developer.mozilla.org/en-US/docs/Web/API/WEBGL_multi_draw WEBGL_multi_draw extension]
  17. ,则使用性能较低的回调。
  18. </p>
  19. <h2>代码示例</h2>
  20. <code>
  21. const box = new THREE.BoxGeometry( 1, 1, 1 );
  22. const sphere = new THREE.SphereGeometry( 1, 12, 12 );
  23. const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
  24. // initialize and add geometries into the batched mesh
  25. const batchedMesh = new BatchedMesh( 10, 5000, 10000, material );
  26. const boxGeometryId = batchedMesh.addGeometry( box );
  27. const sphereGeometryId = batchedMesh.addGeometry( sphere );
  28. // create instances of those geometries
  29. const boxInstancedId1 = batchedMesh.addInstance( boxGeometryId );
  30. const boxInstancedId2 = batchedMesh.addInstance( boxGeometryId );
  31. const sphereInstancedId1 = batchedMesh.addInstance( sphereGeometryId );
  32. const sphereInstancedId2 = batchedMesh.addInstance( sphereGeometryId );
  33. // position the geometries
  34. batchedMesh.setMatrixAt( boxInstancedId1, boxMatrix1 );
  35. batchedMesh.setMatrixAt( boxInstancedId2, boxMatrix2 );
  36. batchedMesh.setMatrixAt( sphereInstancedId1, sphereMatrix1 );
  37. batchedMesh.setMatrixAt( sphereInstancedId2, sphereMatrix2 );
  38. scene.add( batchedMesh );
  39. </code>
  40. <h2>例子</h2>
  41. <p>
  42. [example:webgl_mesh_batch WebGL / mesh / batch]<br />
  43. </p>
  44. <h2>构造函数</h2>
  45. <h3>
  46. [name](
  47. [param:Integer maxInstanceCount], [param:Integer maxVertexCount],
  48. [param:Integer maxIndexCount], [param:Material material],
  49. )
  50. </h3>
  51. <p>
  52. [page:Integer maxInstanceCount] - 计划添加的单个几何体的最大数量。<br />
  53. [page:Integer maxVertexCount] - 所有几何体使用的最大顶点数。<br />
  54. [page:Integer maxIndexCount] - 所有几何图形使用的最大索引数。<br />
  55. [page:Material material] - [page:Material] 的一个实例。默认是新的 [page:MeshBasicMaterial]。<br />
  56. </p>
  57. <h2>属性</h2>
  58. <p>有关常见属性,请参阅 [page:Mesh] 基类</p>
  59. <h3>[property:Box3 boundingBox]</h3>
  60. <p>
  61. 该边界框包围了 [name] 的所有实例。可以用 [page:.computeBoundingBox]() 进行计算。默认为 `null`。
  62. </p>
  63. <h3>[property:Sphere boundingSphere]</h3>
  64. <p>
  65. 该边界球包围了 [name] 的所有实例。可以用 [page:.computeBoundingSphere]() 进行计算。默认为 `null`。
  66. </p>
  67. <h3>[property:Boolean perObjectFrustumCulled]</h3>
  68. <p>
  69. 如果为 true,则 [name] 内的各个对象将被视锥体剔除。默认为 `true`。
  70. </p>
  71. <h3>[property:Boolean sortObjects]</h3>
  72. <p>
  73. 如果为 true,则对 [name] 中的各个对象进行排序以改善与过度绘制相关的工件。如果材质被标记为“透明”,则对象将从后到前渲染,如果没有,则它们从前到后渲染。默认为 `true`。
  74. </p>
  75. <h3>[property:Integer maxInstanceCount]</h3>
  76. <p>
  77. 只读,[name] 中可以存储的单个几何体的最大数量。
  78. </p>
  79. <h3>[property:Boolean isBatchedMesh]</h3>
  80. <p>用于检查给定对象是否属于 [name] 类型的只读标志。</p>
  81. <h2>Methods</h2>
  82. <p>有关常用方法,请参阅 [page:Mesh] 基类。</p>
  83. <h3>[method:undefined computeBoundingBox]()</h3>
  84. <p>
  85. 计算边界框,更新 [page:.boundingBox] 属性。<br />
  86. 默认情况下不计算边界框。它们需要显式计算,否则就是 `null`。
  87. </p>
  88. <h3>[method:undefined computeBoundingSphere]()</h3>
  89. <p>
  90. 计算边界球,更新 [page:.boundingSphere] 属性。<br />
  91. 默认情况下不计算边界球。它们需要显式计算,否则就是 `null`。
  92. </p>
  93. <h3>[method:undefined dispose]()</h3>
  94. <p>
  95. 释放该实例分配的GPU相关资源。每当您的应用程序中不再使用此实例时,请调用此方法。
  96. </p>
  97. <h3>[method:this setCustomSort]( [param:Function sortFunction] )</h3>
  98. <p>
  99. 对渲染之前运行的函数进行排序。该函数需要一个要排序的项目列表和一个相机。列表中的对象包含一个“z”字段,用于执行深度排序。
  100. </p>
  101. <h3>
  102. [method:undefined getColorAt]( [param:Integer instanceId], [param:Color target] )
  103. </h3>
  104. <p>
  105. [page:Integer instanceId]: The id of an instance to get the color of.
  106. </p>
  107. <h3>
  108. [method:Matrix4 getMatrixAt]( [param:Integer index], [param:Matrix4 matrix] )
  109. </h3>
  110. <p>
  111. [page:Integer index]: 实例的索引。值必须在 [0, count] 范围内。
  112. </p>
  113. <p>
  114. [page:Matrix4 matrix]: 这个 4x4 矩阵将被设置为定义实例的局部变换矩阵。
  115. </p>
  116. <p>获取定义实例的局部变换矩阵。</p>
  117. <h3>
  118. [method:Boolean getVisibleAt]( [param:Integer index] )
  119. </h3>
  120. <p>
  121. [page:Integer index]: 实例的索引。值必须在 [0, count] 范围内。
  122. </p>
  123. <p>获取给定实例是否标记为“可见”。</p>
  124. <h3>
  125. [method:Object getGeometryRangeAt]( [param:Integer geometryId], [param:Object target] )
  126. </h3>
  127. <p>
  128. [page:Integer geometryId]: 要获取范围的 geometryId。
  129. </p>
  130. <p>
  131. [page:Object target]: 将范围复制到的可选目标对象。
  132. </p>
  133. <p>获取表示与附着几何体相关的三角形子集的范围,指示起始偏移和计数,如果无效,则为 `null`。</p>
  134. <p>返回以下形式的对象:</p>
  135. <code>{ start: Integer, count: Integer }</code>
  136. <h3>
  137. [method:Integer getGeometryIdAt]( [param:Integer instanceId] )
  138. </h3>
  139. <p>
  140. [page:Integer instanceId]: 要获取几何索引的实例的 id。
  141. </p>
  142. <p>获取定义实例的几何索引。</p>
  143. <h3>
  144. [method:undefined setColorAt]( [param:Integer instanceId], [param:Color color] )
  145. </h3>
  146. <p>
  147. [page:Integer instanceId]: 要设置颜色的实例的 id。
  148. </p>
  149. <p>[page:Color color]: 设置实例的颜色。</p>
  150. <p>
  151. 将给定的颜色设置为定义的几何实例。
  152. </p>
  153. <h3>
  154. [method:this setMatrixAt]( [param:Integer index], [param:Matrix4 matrix] )
  155. </h3>
  156. <p>
  157. [page:Integer index]: 实例的索引。值必须在 [0, count] 范围内。
  158. </p>
  159. <p>
  160. [page:Matrix4 matrix]: 表示单个实例的局部变换的 4x4 矩阵。
  161. </p>
  162. <p>
  163. 将给定的局部变换矩阵设置为定义的实例。
  164. </p>
  165. <h3>
  166. [method:this setVisibleAt]( [param:Integer index], [param:Boolean visible] )
  167. </h3>
  168. <p>
  169. [page:Integer index]: 实例的索引。值必须在 [0, count] 范围内。
  170. </p>
  171. <p>
  172. [page:Boolean visible]: 指示可见性状态的布尔值。
  173. </p>
  174. <p>
  175. 设置给定索引处对象的可见性。
  176. </p>
  177. <h3>
  178. [method:this setGeometryIdAt]( [param:Integer instanceId], [param:Integer geometryId] )
  179. </h3>
  180. <p>
  181. [page:Integer instanceId]: 要设置几何索引的实例的 id。
  182. </p>
  183. <p>
  184. [page:Integer geometryId]: 实例要使用的几何索引。
  185. </p>
  186. <p>
  187. 在给定索引处设置实例的几何索引。
  188. </p>
  189. <h3>
  190. [method:Integer addGeometry]( [param:BufferGeometry geometry], [param:Integer reservedVertexRange], [param:Integer
  191. reservedIndexRange] )
  192. </h3>
  193. <p>
  194. [page:BufferGeometry geometry]: 要添加到 [name] 中的几何体。
  195. </p>
  196. <p>
  197. [page:Integer reservedVertexRange]: 可选参数,指定为添加的几何体保留的顶点缓冲区空间量。如果计划稍后在此索引处设置大于原始几何图形的新几何图形,则这是必要的。默认为给定几何顶点缓冲区的长度。
  198. </p>
  199. <p>
  200. [page:Integer reservedIndexRange]: 可选参数,指定为添加的几何体保留的索引缓冲区空间量。如果计划稍后在此索引处设置大于原始几何图形的新几何图形,则这是必要的。默认为给定几何索引缓冲区的长度。
  201. </p>
  202. <p>
  203. 将给定几何体添加到 [name] 并返回引用它的关联索引。
  204. </p>
  205. <h3>
  206. [method:Integer deleteGeometry]( [param:Integer geometryId] )
  207. </h3>
  208. <p>
  209. [page:Integer geometryId]: 需要从 [name] 中移除的 geometryId,该几何体之前已通过 "addGeometry" 添加。
  210. 任何引用此几何体的实例也将被移除。
  211. </p>
  212. <h3>
  213. [method:Integer addInstance]( [param:Integer geometryId] )
  214. </h3>
  215. <p>
  216. [page:Integer geometryId]: 通过 "addGeometry" 添加的先前 geometryId,将其添加到 [name] 中进行渲染。
  217. </p>
  218. <p>
  219. 使用给定的 geometryId 的几何图形向 [name] 添加一个新实例,并返回一个指向新实例的新 id,以供其他函数使用。
  220. </p>
  221. <h3>
  222. [method:Integer deleteInstance]( [param:Integer instanceId] )
  223. </h3>
  224. <p>
  225. [page:Integer instanceId]: 要从之前通过 "addInstance" 添加的 [name] 中移除的实例的 id。
  226. </p>
  227. <p>
  228. 使用给定的 instanceId 从 [name] 中删除现有实例。
  229. </p>
  230. <h3>
  231. [method:Integer setGeometryAt]( [param:Integer index], [param:BufferGeometry geometry] )
  232. </h3>
  233. <p>
  234. [page:Integer index]: 用该几何图形替换哪个几何图形索引。
  235. </p>
  236. <p>
  237. [page:BufferGeometry geometry]: 在给定几何索引处替换的几何。
  238. </p>
  239. <p>
  240. 用提供的几何图形替换 `index` 的几何图形。如果索引处没有为几何体保留足够的空间,则会引发错误。
  241. </p>
  242. <h3>
  243. [method:this optimize]()
  244. </h3>
  245. <p>
  246. 重新打包 [name] 中的子几何体,以删除先前删除的几何体剩余的任何未使用的空间,释放空间来添加新的几何体。
  247. </p>
  248. <h3>
  249. [method:this setGeometrySize]( maxVertexCount, maxIndexCount )
  250. </h3>
  251. <p>
  252. 将 [name] 顶点和索引缓冲区属性中的可用空间调整为指定的大小。
  253. 如果提供的参数缩小了几何缓冲区,但几何属性末尾没有足够的未使用空间,则会抛出错误。
  254. </p>
  255. <p>
  256. [page:Integer maxVertexCount] - 所有唯一几何体调整大小时所使用的最大顶点数。<br />
  257. [page:Integer maxIndexCount] - 所有唯一几何图形调整大小时使用的最大索引数。<br />
  258. </p>
  259. <h3>
  260. [method:this setInstanceCount]( maxInstanceCount )
  261. </h3>
  262. <p>
  263. 调整必要的缓冲区大小以支持指定的实例数量。如果提供的参数减少了实例数量,但列表末尾没有足够的未使用 id,则会抛出错误。
  264. </p>
  265. <p>
  266. [page:Integer maxInstanceCount] - [name] 可以添加和渲染的最大单个实例数。<br />
  267. </p>
  268. <h2>源代码</h2>
  269. <p>
  270. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  271. </p>
  272. </body>
  273. </html>
粤ICP备19079148号