GLTFExporter.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>GLTFExporter - 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">GLTFExporter</h1>
  13. <section>
  14. <header>
  15. <div class="class-description"><p>An exporter for <code>glTF</code> 2.0.</p>
  16. <p>glTF (GL Transmission Format) is an <a href="https://github.com/KhronosGroup/glTF/tree/master/specification/2.0" target="_blank" rel="noopener">open format specification</a>
  17. for efficient delivery and loading of 3D content. Assets may be provided either in JSON (.gltf)
  18. or binary (.glb) format. External files store textures (.jpg, .png) and additional binary
  19. data (.bin). A glTF asset may deliver one or more scenes, including meshes, materials,
  20. textures, skins, skeletons, morph targets, animations, lights, and/or cameras.</p>
  21. <p>GLTFExporter supports the <a href="https://github.com/KhronosGroup/glTF/tree/master/extensions/" target="_blank" rel="noopener">glTF 2.0 extensions</a>:</p>
  22. <ul>
  23. <li>KHR_lights_punctual</li>
  24. <li>KHR_materials_clearcoat</li>
  25. <li>KHR_materials_dispersion</li>
  26. <li>KHR_materials_emissive_strength</li>
  27. <li>KHR_materials_ior</li>
  28. <li>KHR_materials_iridescence</li>
  29. <li>KHR_materials_specular</li>
  30. <li>KHR_materials_sheen</li>
  31. <li>KHR_materials_transmission</li>
  32. <li>KHR_materials_unlit</li>
  33. <li>KHR_materials_volume</li>
  34. <li>KHR_mesh_quantization</li>
  35. <li>KHR_texture_transform</li>
  36. <li>EXT_materials_bump</li>
  37. <li>EXT_mesh_gpu_instancing</li>
  38. </ul>
  39. <p>The following glTF 2.0 extension is supported by an external user plugin:</p>
  40. <ul>
  41. <li><a href="https://github.com/takahirox/three-gltf-extensions" target="_blank" rel="noopener">KHR_materials_variants</a></li>
  42. </ul></div>
  43. <h2>Code Example</h2>
  44. <div translate="no"><pre><code class="language-js">const exporter = new GLTFExporter();
  45. const data = await exporter.parseAsync( scene, options );
  46. </code></pre></div>
  47. </header>
  48. <article>
  49. <h2 class="subsection-title">Import</h2>
  50. <p><span translate="no">GLTFExporter</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>
  51. <pre><code class="language-js">import { GLTFExporter } from 'three/addons/exporters/GLTFExporter.js';</code></pre>
  52. <div class="container-overview">
  53. <h2>Constructor</h2>
  54. <h3 class="name name-method" id="GLTFExporter" translate="no">new <a href="#GLTFExporter">GLTFExporter</a><span class="signature">()</span> </h3>
  55. <div class="method">
  56. <div class="description">
  57. <p>Constructs a new glTF exporter.</p>
  58. </div>
  59. </div>
  60. </div>
  61. <h2 class="subsection-title">Properties</h2>
  62. <div class="member">
  63. <h3 class="name" id="textureUtils" translate="no">.<a href="#textureUtils">textureUtils</a><span class="type-signature"> : <a href="WebGLTextureUtils.html">WebGLTextureUtils</a> | <a href="WebGPUTextureUtils.html">WebGPUTextureUtils</a></span> </h3>
  64. <div class="description">
  65. <p>A reference to a texture utils module.</p>
  66. <p>Default is <code>null</code>.</p>
  67. </div>
  68. </div>
  69. <h2 class="subsection-title">Methods</h2>
  70. <h3 class="name name-method" id="parse" translate="no">.<a href="#parse">parse</a><span class="signature">( input : <span class="param-type"><a href="Scene.html">Scene</a> | Array.&lt;<a href="Scene.html">Scene</a>></span>, onDone : <span class="param-type"><a href="GLTFExporter.html#~OnDone">GLTFExporter~OnDone</a></span>, onError : <span class="param-type"><a href="GLTFExporter.html#~OnError">GLTFExporter~OnError</a></span>, options : <span class="param-type"><a href="GLTFExporter.html#~Options">GLTFExporter~Options</a></span> )</span> </h3>
  71. <div class="method">
  72. <div class="description">
  73. <p>Parses the given scenes and generates the glTF output.</p>
  74. </div>
  75. <table class="params">
  76. <tbody>
  77. <tr>
  78. <td class="name">
  79. <strong>input</strong>
  80. </td>
  81. <td class="description last">
  82. <p>A scene or an array of scenes.</p>
  83. </td>
  84. </tr>
  85. <tr>
  86. <td class="name">
  87. <strong>onDone</strong>
  88. </td>
  89. <td class="description last">
  90. <p>A callback function that is executed when the export has finished.</p>
  91. </td>
  92. </tr>
  93. <tr>
  94. <td class="name">
  95. <strong>onError</strong>
  96. </td>
  97. <td class="description last">
  98. <p>A callback function that is executed when an error happens.</p>
  99. </td>
  100. </tr>
  101. <tr>
  102. <td class="name">
  103. <strong>options</strong>
  104. </td>
  105. <td class="description last">
  106. <p>options</p>
  107. </td>
  108. </tr>
  109. </tbody>
  110. </table>
  111. </div>
  112. <h3 class="name name-method" id="parseAsync" translate="no">.<a href="#parseAsync">parseAsync</a><span class="signature">( input : <span class="param-type"><a href="Scene.html">Scene</a> | Array.&lt;<a href="Scene.html">Scene</a>></span>, options : <span class="param-type"><a href="GLTFExporter.html#~Options">GLTFExporter~Options</a></span> )</span><span class="type-signature"> : Promise.&lt;(ArrayBuffer|string)></span> </h3>
  113. <div class="method">
  114. <div class="description">
  115. <p>Async version of <a href="GLTFExporter.html#parse">GLTFExporter#parse</a>.</p>
  116. </div>
  117. <table class="params">
  118. <tbody>
  119. <tr>
  120. <td class="name">
  121. <strong>input</strong>
  122. </td>
  123. <td class="description last">
  124. <p>A scene or an array of scenes.</p>
  125. </td>
  126. </tr>
  127. <tr>
  128. <td class="name">
  129. <strong>options</strong>
  130. </td>
  131. <td class="description last">
  132. <p>options.</p>
  133. </td>
  134. </tr>
  135. </tbody>
  136. </table>
  137. <dl class="details">
  138. <dt class="tag-returns"><strong>Returns:</strong> A Promise that resolved with the exported glTF data.</dt>
  139. </dl>
  140. </div>
  141. <h3 class="name name-method" id="register" translate="no">.<a href="#register">register</a><span class="signature">( callback : <span class="param-type">function</span> )</span><span class="type-signature"> : <a href="GLTFExporter.html">GLTFExporter</a></span> </h3>
  142. <div class="method">
  143. <div class="description">
  144. <p>Registers a plugin callback. This API is internally used to implement the various
  145. glTF extensions but can also used by third-party code to add additional logic
  146. to the exporter.</p>
  147. </div>
  148. <table class="params">
  149. <tbody>
  150. <tr>
  151. <td class="name">
  152. <strong>callback</strong>
  153. </td>
  154. <td class="description last">
  155. <p>The callback function to register.</p>
  156. </td>
  157. </tr>
  158. </tbody>
  159. </table>
  160. <dl class="details">
  161. <dt class="tag-returns"><strong>Returns:</strong> A reference to this exporter.</dt>
  162. </dl>
  163. </div>
  164. <h3 class="name name-method" id="setTextureUtils" translate="no">.<a href="#setTextureUtils">setTextureUtils</a><span class="signature">( utils : <span class="param-type"><a href="WebGLTextureUtils.html">WebGLTextureUtils</a> | <a href="WebGPUTextureUtils.html">WebGPUTextureUtils</a></span> )</span><span class="type-signature"> : <a href="GLTFExporter.html">GLTFExporter</a></span> </h3>
  165. <div class="method">
  166. <div class="description">
  167. <p>Sets the texture utils for this exporter. Only relevant when compressed textures have to be exported.</p>
  168. <p>Depending on whether you use <a href="WebGLRenderer.html">WebGLRenderer</a> or <a href="WebGPURenderer.html">WebGPURenderer</a>, you must inject the
  169. corresponding texture utils <a href="WebGLTextureUtils.html">WebGLTextureUtils</a> or <a href="WebGPUTextureUtils.html">WebGPUTextureUtils</a>.</p>
  170. </div>
  171. <table class="params">
  172. <tbody>
  173. <tr>
  174. <td class="name">
  175. <strong>utils</strong>
  176. </td>
  177. <td class="description last">
  178. <p>The texture utils.</p>
  179. </td>
  180. </tr>
  181. </tbody>
  182. </table>
  183. <dl class="details">
  184. <dt class="tag-returns"><strong>Returns:</strong> A reference to this exporter.</dt>
  185. </dl>
  186. </div>
  187. <h3 class="name name-method" id="unregister" translate="no">.<a href="#unregister">unregister</a><span class="signature">( callback : <span class="param-type">function</span> )</span><span class="type-signature"> : <a href="GLTFExporter.html">GLTFExporter</a></span> </h3>
  188. <div class="method">
  189. <div class="description">
  190. <p>Unregisters a plugin callback.</p>
  191. </div>
  192. <table class="params">
  193. <tbody>
  194. <tr>
  195. <td class="name">
  196. <strong>callback</strong>
  197. </td>
  198. <td class="description last">
  199. <p>The callback function to unregister.</p>
  200. </td>
  201. </tr>
  202. </tbody>
  203. </table>
  204. <dl class="details">
  205. <dt class="tag-returns"><strong>Returns:</strong> A reference to this exporter.</dt>
  206. </dl>
  207. </div>
  208. <h2 class="subsection-title">Type Definitions</h2>
  209. <h3 class="name name-method" id="~OnDone" translate="no">.<a href="#~OnDone">OnDone</a><span class="signature">( result : <span class="param-type">ArrayBuffer | string</span> )</span> </h3>
  210. <div class="method">
  211. <div class="description">
  212. <p>onDone callback of <code>GLTFExporter</code>.</p>
  213. </div>
  214. <table class="params">
  215. <tbody>
  216. <tr>
  217. <td class="name">
  218. <strong>result</strong>
  219. </td>
  220. <td class="description last">
  221. <p>The generated .gltf (JSON) or .glb (binary).</p>
  222. </td>
  223. </tr>
  224. </tbody>
  225. </table>
  226. </div>
  227. <h3 class="name name-method" id="~OnError" translate="no">.<a href="#~OnError">OnError</a><span class="signature">( error : <span class="param-type">Error</span> )</span> </h3>
  228. <div class="method">
  229. <div class="description">
  230. <p>onError callback of <code>GLTFExporter</code>.</p>
  231. </div>
  232. <table class="params">
  233. <tbody>
  234. <tr>
  235. <td class="name">
  236. <strong>error</strong>
  237. </td>
  238. <td class="description last">
  239. <p>The error object.</p>
  240. </td>
  241. </tr>
  242. </tbody>
  243. </table>
  244. </div>
  245. <div class="member">
  246. <h3 class="name" id="~Options" translate="no">.<a href="#~Options">Options</a> </h3>
  247. <div class="description">
  248. <p>Export options of <code>GLTFExporter</code>.</p>
  249. </div>
  250. <table class="props">
  251. <tbody>
  252. <tr>
  253. <td class="name">
  254. <strong>trs</strong>
  255. <br>
  256. <span class="param-type">boolean</span>
  257. </td>
  258. <td class="description last">
  259. <p>Export position, rotation and scale instead of matrix per node.</p>
  260. <p>Default is <code>false</code>.</p>
  261. </td>
  262. </tr>
  263. <tr>
  264. <td class="name">
  265. <strong>onlyVisible</strong>
  266. <br>
  267. <span class="param-type">boolean</span>
  268. </td>
  269. <td class="description last">
  270. <p>Export only visible 3D objects.</p>
  271. <p>Default is <code>true</code>.</p>
  272. </td>
  273. </tr>
  274. <tr>
  275. <td class="name">
  276. <strong>binary</strong>
  277. <br>
  278. <span class="param-type">boolean</span>
  279. </td>
  280. <td class="description last">
  281. <p>Export in binary (.glb) format, returning an ArrayBuffer.</p>
  282. <p>Default is <code>false</code>.</p>
  283. </td>
  284. </tr>
  285. <tr>
  286. <td class="name">
  287. <strong>maxTextureSize</strong>
  288. <br>
  289. <span class="param-type">number</span>
  290. </td>
  291. <td class="description last">
  292. <p>Restricts the image maximum size (both width and height) to the given value.</p>
  293. <p>Default is <code>Infinity</code>.</p>
  294. </td>
  295. </tr>
  296. <tr>
  297. <td class="name">
  298. <strong>animations</strong>
  299. <br>
  300. <span class="param-type">Array.&lt;<a href="AnimationClip.html">AnimationClip</a>></span>
  301. </td>
  302. <td class="description last">
  303. <p>List of animations to be included in the export.</p>
  304. <p>Default is <code>[]</code>.</p>
  305. </td>
  306. </tr>
  307. <tr>
  308. <td class="name">
  309. <strong>includeCustomExtensions</strong>
  310. <br>
  311. <span class="param-type">boolean</span>
  312. </td>
  313. <td class="description last">
  314. <p>Export custom glTF extensions defined on an object's <code>userData.gltfExtensions</code> property.</p>
  315. <p>Default is <code>false</code>.</p>
  316. </td>
  317. </tr>
  318. </tbody>
  319. </table>
  320. </div>
  321. <h2 class="subsection-title">Source</h2>
  322. <p>
  323. <a href="https://github.com/mrdoob/three.js/blob/master/examples/jsm/exporters/GLTFExporter.js" translate="no" target="_blank" rel="noopener">examples/jsm/exporters/GLTFExporter.js</a>
  324. </p>
  325. </article>
  326. </section>
  327. <script src="../scripts/linenumber.js"></script>
  328. <script src="../scripts/page.js"></script>
  329. </body>
  330. </html>
粤ICP备19079148号