module-BufferGeometryUtils.html 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>BufferGeometryUtils - Three.js Docs</title>
  6. <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
  7. <script src="../scripts/highlight.min.js"></script>
  8. <link type="text/css" rel="stylesheet" href="../styles/highlight-three.css">
  9. <link type="text/css" rel="stylesheet" href="../styles/page.css">
  10. </head>
  11. <body>
  12. <h1 translate="no">BufferGeometryUtils</h1>
  13. <section>
  14. <header>
  15. </header>
  16. <article>
  17. <h2 class="subsection-title">Import</h2>
  18. <p><span translate="no">BufferGeometryUtils</span> is an addon, and must be imported explicitly, see <a href="https://threejs.org/manual/#en/installation" target="_blank" rel="noopener">Installation#Addons</a>.</p>
  19. <pre><code class="language-js">import * as BufferGeometryUtils from 'three/addons/utils/BufferGeometryUtils.js';</code></pre>
  20. <div class="container-overview">
  21. </div>
  22. <h2 class="subsection-title">Methods</h2>
  23. <h3 class="name name-method" id="~computeMikkTSpaceTangents" translate="no">.<a href="#~computeMikkTSpaceTangents">computeMikkTSpaceTangents</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span>, MikkTSpace : <span class="param-type">Object</span>, negateSign : <span class="param-type">boolean</span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  24. <div class="method">
  25. <div class="description">
  26. <p>Computes vertex tangents using the MikkTSpace algorithm. MikkTSpace generates the same tangents consistently,
  27. and is used in most modelling tools and normal map bakers. Use MikkTSpace for materials with normal maps,
  28. because inconsistent tangents may lead to subtle visual issues in the normal map, particularly around mirrored
  29. UV seams.</p>
  30. <p>In comparison to this method, <a href="BufferGeometry.html#computeTangents">BufferGeometry#computeTangents</a> (a custom algorithm) generates tangents that
  31. probably will not match the tangents in other software. The custom algorithm is sufficient for general use with a
  32. custom material, and may be faster than MikkTSpace.</p>
  33. <p>Returns the original BufferGeometry. Indexed geometries will be de-indexed. Requires position, normal, and uv attributes.</p>
  34. </div>
  35. <table class="params">
  36. <tbody>
  37. <tr>
  38. <td class="name">
  39. <strong>geometry</strong>
  40. </td>
  41. <td class="description last">
  42. <p>The geometry to compute tangents for.</p>
  43. </td>
  44. </tr>
  45. <tr>
  46. <td class="name">
  47. <strong>MikkTSpace</strong>
  48. </td>
  49. <td class="description last">
  50. <p>Instance of <code>examples/jsm/libs/mikktspace.module.js</code>, or <code>mikktspace</code> npm package.
  51. Await <code>MikkTSpace.ready</code> before use.</p>
  52. </td>
  53. </tr>
  54. <tr>
  55. <td class="name">
  56. <strong>negateSign</strong>
  57. </td>
  58. <td class="description last">
  59. <p>Whether to negate the sign component (.w) of each tangent.
  60. Required for normal map conventions in some formats, including glTF.</p>
  61. <p>Default is <code>true</code>.</p>
  62. </td>
  63. </tr>
  64. </tbody>
  65. </table>
  66. <dl class="details">
  67. <dt class="tag-returns"><strong>Returns:</strong> The updated geometry.</dt>
  68. </dl>
  69. </div>
  70. <h3 class="name name-method" id="~computeMorphedAttributes" translate="no">.<a href="#~computeMorphedAttributes">computeMorphedAttributes</a><span class="signature">( object : <span class="param-type"><a href="Mesh.html">Mesh</a> | <a href="Line.html">Line</a> | <a href="Points.html">Points</a></span> )</span><span class="type-signature"> : Object</span> <span class="type-signature">(inner) </span></h3>
  71. <div class="method">
  72. <div class="description">
  73. <p>Calculates the morphed attributes of a morphed/skinned BufferGeometry.</p>
  74. <p>Helpful for Raytracing or Decals (i.e. a <code>DecalGeometry</code> applied to a morphed Object with a <code>BufferGeometry</code>
  75. will use the original <code>BufferGeometry</code>, not the morphed/skinned one, generating an incorrect result.
  76. Using this function to create a shadow <code>Object3</code>D the <code>DecalGeometry</code> can be correctly generated).</p>
  77. </div>
  78. <table class="params">
  79. <tbody>
  80. <tr>
  81. <td class="name">
  82. <strong>object</strong>
  83. </td>
  84. <td class="description last">
  85. <p>The 3D object to compute morph attributes for.</p>
  86. </td>
  87. </tr>
  88. </tbody>
  89. </table>
  90. <dl class="details">
  91. <dt class="tag-returns"><strong>Returns:</strong> An object with original position/normal attributes and morphed ones.</dt>
  92. </dl>
  93. </div>
  94. <h3 class="name name-method" id="~deepCloneAttribute" translate="no">.<a href="#~deepCloneAttribute">deepCloneAttribute</a><span class="signature">( attribute : <span class="param-type"><a href="BufferAttribute.html">BufferAttribute</a></span> )</span><span class="type-signature"> : <a href="BufferAttribute.html">BufferAttribute</a></span> <span class="type-signature">(inner) </span></h3>
  95. <div class="method">
  96. <div class="description">
  97. <p>Performs a deep clone of the given buffer attribute.</p>
  98. </div>
  99. <table class="params">
  100. <tbody>
  101. <tr>
  102. <td class="name">
  103. <strong>attribute</strong>
  104. </td>
  105. <td class="description last">
  106. <p>The attribute to clone.</p>
  107. </td>
  108. </tr>
  109. </tbody>
  110. </table>
  111. <dl class="details">
  112. <dt class="tag-returns"><strong>Returns:</strong> The cloned attribute.</dt>
  113. </dl>
  114. </div>
  115. <h3 class="name name-method" id="~deinterleaveAttribute" translate="no">.<a href="#~deinterleaveAttribute">deinterleaveAttribute</a><span class="signature">( attribute : <span class="param-type"><a href="InterleavedBufferAttribute.html">InterleavedBufferAttribute</a></span> )</span><span class="type-signature"> : <a href="BufferAttribute.html">BufferAttribute</a></span> <span class="type-signature">(inner) </span></h3>
  116. <div class="method">
  117. <div class="description">
  118. <p>Returns a new, non-interleaved version of the given attribute.</p>
  119. </div>
  120. <table class="params">
  121. <tbody>
  122. <tr>
  123. <td class="name">
  124. <strong>attribute</strong>
  125. </td>
  126. <td class="description last">
  127. <p>The interleaved attribute.</p>
  128. </td>
  129. </tr>
  130. </tbody>
  131. </table>
  132. <dl class="details">
  133. <dt class="tag-returns"><strong>Returns:</strong> The non-interleaved attribute.</dt>
  134. </dl>
  135. </div>
  136. <h3 class="name name-method" id="~deinterleaveGeometry" translate="no">.<a href="#~deinterleaveGeometry">deinterleaveGeometry</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span> )</span> <span class="type-signature">(inner) </span></h3>
  137. <div class="method">
  138. <div class="description">
  139. <p>Deinterleaves all attributes on the given geometry.</p>
  140. </div>
  141. <table class="params">
  142. <tbody>
  143. <tr>
  144. <td class="name">
  145. <strong>geometry</strong>
  146. </td>
  147. <td class="description last">
  148. <p>The geometry to deinterleave.</p>
  149. </td>
  150. </tr>
  151. </tbody>
  152. </table>
  153. </div>
  154. <h3 class="name name-method" id="~estimateBytesUsed" translate="no">.<a href="#~estimateBytesUsed">estimateBytesUsed</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span> )</span><span class="type-signature"> : number</span> <span class="type-signature">(inner) </span></h3>
  155. <div class="method">
  156. <div class="description">
  157. <p>Returns the amount of bytes used by all attributes to represent the geometry.</p>
  158. </div>
  159. <table class="params">
  160. <tbody>
  161. <tr>
  162. <td class="name">
  163. <strong>geometry</strong>
  164. </td>
  165. <td class="description last">
  166. <p>The geometry.</p>
  167. </td>
  168. </tr>
  169. </tbody>
  170. </table>
  171. <dl class="details">
  172. <dt class="tag-returns"><strong>Returns:</strong> The estimate bytes used.</dt>
  173. </dl>
  174. </div>
  175. <h3 class="name name-method" id="~interleaveAttributes" translate="no">.<a href="#~interleaveAttributes">interleaveAttributes</a><span class="signature">( attributes : <span class="param-type">Array.&lt;<a href="BufferAttribute.html">BufferAttribute</a>></span> )</span><span class="type-signature"> : Array.&lt;<a href="InterleavedBufferAttribute.html">InterleavedBufferAttribute</a>></span> <span class="type-signature">(inner) </span></h3>
  176. <div class="method">
  177. <div class="description">
  178. <p>Interleaves a set of attributes and returns a new array of corresponding attributes that share a
  179. single <a href="InterleavedBuffer.html">InterleavedBuffer</a> instance. All attributes must have compatible types.</p>
  180. </div>
  181. <table class="params">
  182. <tbody>
  183. <tr>
  184. <td class="name">
  185. <strong>attributes</strong>
  186. </td>
  187. <td class="description last">
  188. <p>The attributes to interleave.</p>
  189. </td>
  190. </tr>
  191. </tbody>
  192. </table>
  193. <dl class="details">
  194. <dt class="tag-returns"><strong>Returns:</strong> An array of interleaved attributes. If interleave does not succeed, the method returns <code>null</code>.</dt>
  195. </dl>
  196. </div>
  197. <h3 class="name name-method" id="~mergeAttributes" translate="no">.<a href="#~mergeAttributes">mergeAttributes</a><span class="signature">( attributes : <span class="param-type">Array.&lt;<a href="BufferAttribute.html">BufferAttribute</a>></span> )</span><span class="type-signature"> : <a href="BufferAttribute.html">BufferAttribute</a></span> <span class="type-signature">(inner) </span></h3>
  198. <div class="method">
  199. <div class="description">
  200. <p>Merges a set of attributes into a single instance. All attributes must have compatible properties and types.
  201. Instances of <a href="InterleavedBufferAttribute.html">InterleavedBufferAttribute</a> are not supported.</p>
  202. </div>
  203. <table class="params">
  204. <tbody>
  205. <tr>
  206. <td class="name">
  207. <strong>attributes</strong>
  208. </td>
  209. <td class="description last">
  210. <p>The attributes to merge.</p>
  211. </td>
  212. </tr>
  213. </tbody>
  214. </table>
  215. <dl class="details">
  216. <dt class="tag-returns"><strong>Returns:</strong> The merged attribute. Returns <code>null</code> if the merge does not succeed.</dt>
  217. </dl>
  218. </div>
  219. <h3 class="name name-method" id="~mergeGeometries" translate="no">.<a href="#~mergeGeometries">mergeGeometries</a><span class="signature">( geometries : <span class="param-type">Array.&lt;<a href="BufferGeometry.html">BufferGeometry</a>></span>, useGroups : <span class="param-type">boolean</span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  220. <div class="method">
  221. <div class="description">
  222. <p>Merges a set of geometries into a single instance. All geometries must have compatible attributes.</p>
  223. </div>
  224. <table class="params">
  225. <tbody>
  226. <tr>
  227. <td class="name">
  228. <strong>geometries</strong>
  229. </td>
  230. <td class="description last">
  231. <p>The geometries to merge.</p>
  232. </td>
  233. </tr>
  234. <tr>
  235. <td class="name">
  236. <strong>useGroups</strong>
  237. </td>
  238. <td class="description last">
  239. <p>Whether to use groups or not.</p>
  240. <p>Default is <code>false</code>.</p>
  241. </td>
  242. </tr>
  243. </tbody>
  244. </table>
  245. <dl class="details">
  246. <dt class="tag-returns"><strong>Returns:</strong> The merged geometry. Returns <code>null</code> if the merge does not succeed.</dt>
  247. </dl>
  248. </div>
  249. <h3 class="name name-method" id="~mergeGroups" translate="no">.<a href="#~mergeGroups">mergeGroups</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  250. <div class="method">
  251. <div class="description">
  252. <p>Merges the <a href="BufferGeometry.html#groups">BufferGeometry#groups</a> for the given geometry.</p>
  253. </div>
  254. <table class="params">
  255. <tbody>
  256. <tr>
  257. <td class="name">
  258. <strong>geometry</strong>
  259. </td>
  260. <td class="description last">
  261. <p>The geometry to modify.</p>
  262. </td>
  263. </tr>
  264. </tbody>
  265. </table>
  266. <dl class="details">
  267. <dt class="tag-returns"><strong>Returns:</strong> <ul>
  268. <li>The updated geometry</li>
  269. </ul></dt>
  270. </dl>
  271. </div>
  272. <h3 class="name name-method" id="~mergeVertices" translate="no">.<a href="#~mergeVertices">mergeVertices</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span>, tolerance : <span class="param-type">number</span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  273. <div class="method">
  274. <div class="description">
  275. <p>Returns a new geometry with vertices for which all similar vertex attributes (within tolerance) are merged.</p>
  276. </div>
  277. <table class="params">
  278. <tbody>
  279. <tr>
  280. <td class="name">
  281. <strong>geometry</strong>
  282. </td>
  283. <td class="description last">
  284. <p>The geometry to merge vertices for.</p>
  285. </td>
  286. </tr>
  287. <tr>
  288. <td class="name">
  289. <strong>tolerance</strong>
  290. </td>
  291. <td class="description last">
  292. <p>The tolerance value.</p>
  293. <p>Default is <code>1e-4</code>.</p>
  294. </td>
  295. </tr>
  296. </tbody>
  297. </table>
  298. <dl class="details">
  299. <dt class="tag-returns"><strong>Returns:</strong> <ul>
  300. <li>The new geometry with merged vertices.</li>
  301. </ul></dt>
  302. </dl>
  303. </div>
  304. <h3 class="name name-method" id="~toCreasedNormals" translate="no">.<a href="#~toCreasedNormals">toCreasedNormals</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span>, creaseAngle : <span class="param-type">number</span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  305. <div class="method">
  306. <div class="description">
  307. <p>Modifies the supplied geometry if it is non-indexed, otherwise creates a new,
  308. non-indexed geometry. Returns the geometry with smooth normals everywhere except
  309. faces that meet at an angle greater than the crease angle.</p>
  310. </div>
  311. <table class="params">
  312. <tbody>
  313. <tr>
  314. <td class="name">
  315. <strong>geometry</strong>
  316. </td>
  317. <td class="description last">
  318. <p>The geometry to modify.</p>
  319. </td>
  320. </tr>
  321. <tr>
  322. <td class="name">
  323. <strong>creaseAngle</strong>
  324. </td>
  325. <td class="description last">
  326. <p>The crease angle in radians.</p>
  327. <p>Default is <code>Math.PI/3</code>.</p>
  328. </td>
  329. </tr>
  330. </tbody>
  331. </table>
  332. <dl class="details">
  333. <dt class="tag-returns"><strong>Returns:</strong> <ul>
  334. <li>The updated geometry</li>
  335. </ul></dt>
  336. </dl>
  337. </div>
  338. <h3 class="name name-method" id="~toTrianglesDrawMode" translate="no">.<a href="#~toTrianglesDrawMode">toTrianglesDrawMode</a><span class="signature">( geometry : <span class="param-type"><a href="BufferGeometry.html">BufferGeometry</a></span>, drawMode : <span class="param-type">number</span> )</span><span class="type-signature"> : <a href="BufferGeometry.html">BufferGeometry</a></span> <span class="type-signature">(inner) </span></h3>
  339. <div class="method">
  340. <div class="description">
  341. <p>Returns a new indexed geometry based on <code>TrianglesDrawMode</code> draw mode.
  342. This mode corresponds to the <code>gl.TRIANGLES</code> primitive in WebGL.</p>
  343. </div>
  344. <table class="params">
  345. <tbody>
  346. <tr>
  347. <td class="name">
  348. <strong>geometry</strong>
  349. </td>
  350. <td class="description last">
  351. <p>The geometry to convert.</p>
  352. </td>
  353. </tr>
  354. <tr>
  355. <td class="name">
  356. <strong>drawMode</strong>
  357. </td>
  358. <td class="description last">
  359. <p>The current draw mode.</p>
  360. </td>
  361. </tr>
  362. </tbody>
  363. </table>
  364. <dl class="details">
  365. <dt class="tag-returns"><strong>Returns:</strong> The new geometry using <code>TrianglesDrawMode</code>.</dt>
  366. </dl>
  367. </div>
  368. <h2 class="subsection-title">Source</h2>
  369. <p>
  370. <a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/utils/BufferGeometryUtils.js" translate="no" target="_blank" rel="noopener">examples/jsm/utils/BufferGeometryUtils.js</a>
  371. </p>
  372. </article>
  373. </section>
  374. <script src="../scripts/linenumber.js"></script>
  375. <script src="../scripts/page.js"></script>
  376. </body>
  377. </html>
粤ICP备19079148号