|
|
@@ -10,22 +10,20 @@
|
|
|
<body>
|
|
|
[page:Loader] →
|
|
|
|
|
|
- <h1>[name]</h1>
|
|
|
-
|
|
|
- <p class="desc"> A loader for <em>glTF 2.0</em> resources. <br /><br />
|
|
|
- [link:https://www.khronos.org/gltf glTF] (GL Transmission Format) is an
|
|
|
- [link:https://github.com/KhronosGroup/glTF/tree/master/specification/2.0 open format specification]
|
|
|
- for efficient delivery and loading of 3D content. Assets may be provided either in JSON (.gltf)
|
|
|
- or binary (.glb) format. External files store textures (.jpg, .png) and additional binary
|
|
|
- data (.bin). A glTF asset may deliver one or more scenes, including meshes, materials,
|
|
|
- textures, skins, skeletons, morph targets, animations, lights, and/or cameras.
|
|
|
+ <h1>GLTF加载器（[name]）</h1>
|
|
|
+
|
|
|
+ <p class="desc">用于载入<em>glTF 2.0</em>资源的加载器。<br /><br />
|
|
|
+ [link:https://www.khronos.org/gltf glTF]（gl传输格式）是一种开放格式的规范
|
|
|
+ （[link:https://github.com/KhronosGroup/glTF/tree/master/specification/2.0 open format specification]），
|
|
|
+ 用于更高效地传输、加载3D内容。该类文件以JSON（.glft）格式或二进制（.glb）格式提供，
|
|
|
+ 外部文件存储贴图（.jpg、.png）和额外的二进制数据（.bin）。一个glTF组件可传输一个或多个场景，
|
|
|
+ 包括网格、材质、贴图、蒙皮、骨架、变形目标、动画、灯光以及摄像机。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Extensions</h2>
|
|
|
+ <h2>扩展</h2>
|
|
|
|
|
|
<p>
|
|
|
- GLTFLoader supports the following
|
|
|
- [link:https://github.com/KhronosGroup/glTF/tree/master/extensions/ glTF 2.0 extensions]:
|
|
|
+ GLTFLoader支持下列glTF 2.0扩展（[link:https://github.com/KhronosGroup/glTF/tree/master/extensions/ glTF 2.0 extensions]）：
|
|
|
</p>
|
|
|
|
|
|
<ul>
|
|
|
@@ -38,19 +36,20 @@
|
|
|
</ul>
|
|
|
|
|
|
<p><i>
|
|
|
- <sup>1</sup>Requires [link:https://threejs.org/docs/#api/en/renderers/WebGLRenderer.physicallyCorrectLights physicallyCorrectLights] to be enabled.
|
|
|
+ <sup>1</sup>需要[link:https://threejs.org/docs/#api/en/renderers/WebGLRenderer.physicallyCorrectLights physicallyCorrectLights]被启用。
|
|
|
</i></p>
|
|
|
<p><i>
|
|
|
- <sup>2</sup>UV transforms are supported, with several key limitations. Transforms applied to
|
|
|
+ <sup>2</sup>支持UV变换，但存在一些重要的限制。
|
|
|
+ Transforms applied to
|
|
|
a texture using the first UV slot (all textures except aoMap and lightMap) must share the same
|
|
|
- transform, or no transfor at all. The aoMap and lightMap textures cannot be transformed. No
|
|
|
- more than one transform may be used per material. Each use of a texture with a unique
|
|
|
- transform will result in an additional GPU texture upload. See
|
|
|
- #[link:https://github.com/mrdoob/three.js/pull/13831 13831] and
|
|
|
- #[link:https://github.com/mrdoob/three.js/issues/12788 12788].
|
|
|
+ transform, or no transfor at all.
|
|
|
+ aoMap 和 lightMap 纹理不能被变换。每个材质最多只能使用一次变换。
|
|
|
+ 每次对使用具有唯一变换的纹理都会导致一次额外的GPU纹理上传。
|
|
|
+ 请参阅#[link:https://github.com/mrdoob/three.js/pull/13831 13831] 和
|
|
|
+ #[link:https://github.com/mrdoob/three.js/issues/12788 12788]。
|
|
|
</i></p>
|
|
|
|
|
|
- <h2>Example</h2>
|
|
|
+ <h2>示例</h2>
|
|
|
|
|
|
<code>
|
|
|
// Instantiate a loader
|
|
|
@@ -94,29 +93,25 @@
|
|
|
|
|
|
[example:webgl_loader_gltf]
|
|
|
|
|
|
- <h2>Browser compatibility</h2>
|
|
|
+ <h2>浏览器兼容性</h2>
|
|
|
|
|
|
- <p>GLTFLoader relies on ES6 [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise Promises],
|
|
|
- which are not supported in IE11. To use the loader in IE11, you must
|
|
|
- [link:https://github.com/stefanpenner/es6-promise include a polyfill]
|
|
|
- providing a Promise replacement.</p>
|
|
|
+ <p>GLTFLoader 依赖 ES6 [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise Promises]，
|
|
|
+ 这一特性不支持IE11。若要在IE11中使用该加载器，你必须引入polyfill（[link:https://github.com/stefanpenner/es6-promise include a polyfill]）
|
|
|
+ 来提供一个Promise的替代方案。</p>
|
|
|
|
|
|
- <h2>Textures</h2>
|
|
|
+ <h2>纹理</h2>
|
|
|
|
|
|
- <p>Textures containing color information (.map, .emissiveMap, and .specularMap) always use sRGB colorspace in
|
|
|
- glTF, while vertex colors and material properties (.color, .emissive, .specular) use linear colorspace. In a
|
|
|
- typical rendering workflow, textures are converted to linear colorspace by the renderer, lighting calculations
|
|
|
- are made, then final output is converted back to sRGB and displayed on screen. Unless you need post-processing
|
|
|
- in linear colorspace, always configure [page:WebGLRenderer] as follows when using glTF:</p>
|
|
|
+ <p>纹理中包含的颜色信息（.map, .emissiveMap, 和 .specularMap）在glTF中总是使用sRGB颜色空间，而顶点颜色和材质属性（.color, .emissive, .specular）
|
|
|
+ 则使用线性颜色空间。在典型的渲染工作流程中，纹理会被渲染器转换为线性颜色空间，进行光照计算，然后最终输出会被转换回 sRGB
|
|
|
+ 颜色空间并显示在屏幕上。除非你需要使用线性颜色空间进行后期处理，否则请在使用glTF的时候将[page:WebGLRenderer]进行如下配置：</p>
|
|
|
|
|
|
<code>
|
|
|
renderer.gammaOutput = true;
|
|
|
renderer.gammaFactor = 2.2;
|
|
|
</code>
|
|
|
|
|
|
- <p>GLTFLoader will automatically configure textures referenced from a .gltf or .glb file correctly, with the
|
|
|
- assumption that the renderer is set up as shown above. When loading textures externally (e.g., using
|
|
|
- [page:TextureLoader]) and applying them to a glTF model, colorspace and orientation must be given:</p>
|
|
|
+ <p>假设渲染器的配置如上所示，则GLTFLoader将可以正确地自动配置从.gltf或.glb文件中引用的纹理。
|
|
|
+ 当从外部加载纹理（例如，使用[page:TextureLoader]）并将纹理应用到glTF模型，则必须给定对应的颜色空间与朝向：</p>
|
|
|
|
|
|
<code>
|
|
|
// If texture is used for color information, set colorspace.
|
|
|
@@ -126,11 +121,11 @@
|
|
|
texture.flipY = false;
|
|
|
</code>
|
|
|
|
|
|
- <h2>Custom extensions</h2>
|
|
|
+ <h2>自定义扩展</h2>
|
|
|
|
|
|
<p>
|
|
|
- Metadata from unknown extensions is preserved as “.userData.gltfExtensions” on Object3D, Scene, and Material instances,
|
|
|
- or attached to the response “gltf” object. Example:
|
|
|
+ 来自未知扩展的元数据会被保存到Object3D、Scene和Material实例中上的“.userData.gltfExtensions”，
|
|
|
+ 或被附加到 response “gltf”对象。示例：
|
|
|
</p>
|
|
|
|
|
|
<code>
|
|
|
@@ -151,58 +146,58 @@
|
|
|
<br>
|
|
|
<hr>
|
|
|
|
|
|
- <h2>Constructor</h2>
|
|
|
+ <h2>构造函数</h2>
|
|
|
|
|
|
<h3>[name]( [param:LoadingManager manager] )</h3>
|
|
|
<p>
|
|
|
- [page:LoadingManager manager] — The [page:LoadingManager loadingManager] for the loader to use. Default is [page:LoadingManager THREE.DefaultLoadingManager].
|
|
|
+ [page:LoadingManager manager] — 该加载器将要使用的 [page:LoadingManager loadingManager] 。默认为 [page:LoadingManager THREE.DefaultLoadingManager]。
|
|
|
</p>
|
|
|
<p>
|
|
|
- Creates a new [name].
|
|
|
+ 创建一个新的[name]。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Properties</h2>
|
|
|
- <p>See the base [page:Loader] class for common properties.</p>
|
|
|
+ <h2>属性</h2>
|
|
|
+ <p>共有属性请参见其基类[page:Loader]。</p>
|
|
|
|
|
|
- <h2>Methods</h2>
|
|
|
- <p>See the base [page:Loader] class for common methods.</p>
|
|
|
+ <h2>方法</h2>
|
|
|
+ <p>共有方法请参见其基类[page:Loader]。</p>
|
|
|
|
|
|
<h3>[method:null load]( [param:String url], [param:Function onLoad], [param:Function onProgress], [param:Function onError] )</h3>
|
|
|
<p>
|
|
|
- [page:String url] — A string containing the path/URL of the <em>.gltf</em> or <em>.glb</em> file.<br />
|
|
|
- [page:Function onLoad] — A function to be called after the loading is successfully completed. The function receives the loaded JSON response returned from [page:Function parse].<br />
|
|
|
- [page:Function onProgress] — (optional) A function to be called while the loading is in progress. The argument will be the XMLHttpRequest instance, that contains .[page:Integer total] and .[page:Integer loaded] bytes.<br />
|
|
|
- [page:Function onError] — (optional) A function to be called if an error occurs during loading. The function receives error as an argument.<br />
|
|
|
+ [page:String url] — 包含有<em>.gltf</em>/<em>.glb</em>文件路径/URL的字符串。<br />
|
|
|
+ [page:Function onLoad] — 加载成功完成后将会被调用的函数。该函数接收[page:Function parse]所返回的已加载的JSON响应。<br />
|
|
|
+ [page:Function onProgress] — （可选）加载正在进行过程中会被调用的函数。其参数将会是XMLHttpRequest实例，包含有总字节数.[page:Integer total]与已加载的字节数.[page:Integer loaded]。<br />
|
|
|
+ [page:Function onError] — （可选）若在加载过程发生错误，将被调用的函数。该函数接收error来作为参数。<br />
|
|
|
</p>
|
|
|
<p>
|
|
|
- Begin loading from url and call the callback function with the parsed response content.
|
|
|
+ 开始从url加载，并使用解析过的响应内容调用回调函数。
|
|
|
</p>
|
|
|
|
|
|
<h3>[method:null setDRACOLoader]( [param:DRACOLoader dracoLoader] )</h3>
|
|
|
<p>
|
|
|
- [page:DRACOLoader dracoLoader] — Instance of THREE.DRACOLoader, to be used for decoding assets compressed with the KHR_draco_mesh_compression extension.
|
|
|
+ [page:DRACOLoader dracoLoader] — THREE.DRACOLoader的实例，用于解码使用KHR_draco_mesh_compression扩展压缩过的文件。
|
|
|
</p>
|
|
|
<p>
|
|
|
- Refer to this [link:https://github.com/mrdoob/three.js/tree/dev/examples/js/libs/draco#readme readme] for the details of Draco and its decoder.
|
|
|
+ 请参阅[link:https://github.com/mrdoob/three.js/tree/dev/examples/js/libs/draco#readme readme]来了解Draco及其解码器的详细信息。
|
|
|
</p>
|
|
|
|
|
|
<h3>[method:null setDDSLoader]( [param:DDSLoader ddsLoader] )</h3>
|
|
|
<p>
|
|
|
- [page:DDSLoader ddsLoader] — Instance of THREE.DDSLoader, to be used for loading compressed textures with the MSFT_TEXTURE_DDS extension.
|
|
|
+ [page:DDSLoader ddsLoader] — THREE.DDSLoader的实例，用于加载使用MSFT_TEXTURE_DDS扩展压缩过的纹理。
|
|
|
</p>
|
|
|
|
|
|
<h3>[method:null parse]( [param:ArrayBuffer data], [param:String path], [param:Function onLoad], [param:Function onError] )</h3>
|
|
|
<p>
|
|
|
- [page:ArrayBuffer data] — glTF asset to parse, as an ArrayBuffer or <em>JSON</em> string.<br />
|
|
|
- [page:String path] — The base path from which to find subsequent glTF resources such as textures and .bin data files.<br />
|
|
|
- [page:Function onLoad] — A function to be called when parse completes.<br />
|
|
|
- [page:Function onError] — (optional) A function to be called if an error occurs during parsing. The function receives error as an argument.<br />
|
|
|
+ [page:ArrayBuffer data] — 需要解析的glTF文件，值为一个ArrayBuffer或<em>JSON</em>字符串。<br />
|
|
|
+ [page:String path] — 用于找到后续glTF资源（如纹理和.bin数据文件）的基础路径。<br />
|
|
|
+ [page:Function onLoad] — 解析成功完成后将会被调用的函数。<br />
|
|
|
+ [page:Function onError] — （可选）若在解析过程发生错误，将被调用的函数。该函数接收error来作为参数。<br />
|
|
|
</p>
|
|
|
<p>
|
|
|
- Parse a glTF-based ArrayBuffer or <em>JSON</em> String and fire [page:Function onLoad] callback when complete. The argument to [page:Function onLoad] will be an [page:object] that contains loaded parts: .[page:Scene scene], .[page:Array scenes], .[page:Array cameras], .[page:Array animations], and .[page:Object asset].
|
|
|
+ 解析基于glTF的ArrayBuffer或<em>JSON</em>字符串，并在完成后触发[page:Function onLoad]回调。[page:Function onLoad]的参数将是一个包含有已加载部分的[page:object]：.[page:Scene scene]、 .[page:Array scenes]、 .[page:Array cameras]、 .[page:Array animations] 和 .[page:Object asset]。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Source</h2>
|
|
|
+ <h2>源代码</h2>
|
|
|
|
|
|
<p>
|
|
|
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/GLTFLoader.js examples/js/loaders/GLTFLoader.js]
|
gogoend