|
@@ -14,44 +14,36 @@
|
|
|
<br />
|
|
|
|
|
|
<p>
|
|
|
- 3D models are available in hundreds of file formats, each with different
|
|
|
- purposes, assorted features, and varying complexity. Although
|
|
|
- <a href="https://github.com/mrdoob/three.js/tree/dev/examples/js/loaders" target="_blank" rel="noopener">
|
|
|
- three.js provides many loaders</a>, choosing the right format and
|
|
|
- workflow will save time and frustration later on. Some formats are
|
|
|
- difficult to work with, inefficient for realtime experiences, or simply not
|
|
|
- fully supported at this time.
|
|
|
+ 3D模型目前的有成千上万钟格式,每一种格式都具有不同的目的、用途以及复杂性。
|
|
|
+ 虽然<a href="https://github.com/mrdoob/three.js/tree/dev/examples/js/loaders" target="_blank" rel="noopener">
|
|
|
+ three.js已经提供了多种导入工具</a>
|
|
|
+ 选择正确的文件格式以及工作流程将可以节省很多时间,以及避免很多挫折。某些格式难以使用,或者实时体验效率低下,或者目前尚未得到完全支持。
|
|
|
</p>
|
|
|
|
|
|
<p>
|
|
|
- This guide provides a workflow recommended for most users, and suggestions
|
|
|
- for what to try if things don't go as expected.
|
|
|
+ 对大多数用户,本指南针推荐了以一个工作流程,以及当没有达到预期的效果时的建议。
|
|
|
+
|
|
|
</p>
|
|
|
|
|
|
- <h2>Before we start</h2>
|
|
|
+ <h2>在开始之前</h2>
|
|
|
|
|
|
<p>
|
|
|
- If you're new to running a local server, begin with
|
|
|
- [link:#manual/introduction/How-to-run-things-locally how to run things locally]
|
|
|
- first. Many common errors viewing 3D models can be avoided by hosting files
|
|
|
- correctly.
|
|
|
+ 如果你是第一次运行一个本地服务器,可以先阅读[link:#manual/introduction/How-to-run-things-locally how to run things locally]。
|
|
|
+ 通过正确地托管文件,可以避免很多查看3D模型时的常见错误。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Recommended workflow</h2>
|
|
|
+ <h2>推荐的工作流程</h2>
|
|
|
|
|
|
<p>
|
|
|
- Where possible, we recommend using glTF (GL Transmission Format). Both
|
|
|
- <small>.GLB</small> and <small>.GLTF</small> versions of the format are
|
|
|
- well supported. Because glTF is focused on runtime asset delivery, it is
|
|
|
- compact to transmit and fast to load. Features include meshes, materials,
|
|
|
- textures, skins, skeletons, morph targets, animations, lights, and
|
|
|
- cameras.
|
|
|
+ 如果有可能的话,我们推荐使用glTF(GL传输格式)。<small>.GLB</small>和<small>.GLTF</small>是这种格式的这两种不同版本,
|
|
|
+ 都可以被很好地支持。由于glTF这种格式是专注于运行时的效果呈现的,所以它的传输效率是非常紧凑,而且加载速度很快。
|
|
|
+ 功能方面包含了网格、材质、纹理、皮肤、骨骼、变形目标、动画、灯光和摄像机。
|
|
|
</p>
|
|
|
|
|
|
<p>
|
|
|
- Public-domain glTF files are available on sites like
|
|
|
+ 公共领域的glTF文件可以在网上找到,例如
|
|
|
<a href="https://sketchfab.com/models?features=downloadable&sort_by=-likeCount&type=models" target="_blank" rel="noopener">
|
|
|
- Sketchfab</a>, or various tools include glTF export:
|
|
|
+ Sketchfab</a>,或者很多工具包含了glTF的导出功能:
|
|
|
</p>
|
|
|
|
|
|
<ul>
|
|
@@ -66,62 +58,50 @@
|
|
|
</ul>
|
|
|
|
|
|
<p>
|
|
|
- If your preferred tools do not support glTF, consider requesting glTF
|
|
|
- export from the authors, or posting on
|
|
|
- <a href="https://github.com/KhronosGroup/glTF/issues/1051" target="_blank" rel="noopener">the glTF roadmap thread</a>.
|
|
|
+ 倘若你所喜欢的工具不支持glTF格式,请考虑向该工具的作者请求glTF导出功能,
|
|
|
+ 或者在<a href="https://github.com/KhronosGroup/glTF/issues/1051" target="_blank" rel="noopener">the glTF roadmap thread</a>贴出你的想法。
|
|
|
+
|
|
|
</p>
|
|
|
|
|
|
<p>
|
|
|
- When glTF is not an option, popular formats such as FBX, OBJ, or COLLADA
|
|
|
- are also available and regularly maintained.
|
|
|
+ 当glTF不能被作为一个选项的时候,诸如FBX、OBJ或者COLLADA等等其它受欢迎的格式也是可以使用、并且是也定期维护的。
|
|
|
</p>
|
|
|
|
|
|
- <h2>Troubleshooting</h2>
|
|
|
+ <h2>故障排除</h2>
|
|
|
|
|
|
<p>
|
|
|
- You've spent hours modeling an artisanal masterpiece, you load it into
|
|
|
- the webpage, and — oh no! 😭 It's distorted, miscolored, or missing entirely.
|
|
|
- Start with these troubleshooting steps:
|
|
|
+ 你在花了几个小时亲手建了一个堪称杰作的模型,现在你把它给导入到网页中——
|
|
|
+ 哦,我的天呐~😭它导入以后完全失真了、材质贴图丢了、或者说整个模型完全丢失了!
|
|
|
+ 接下来我们来按照下面的步骤排除故障:
|
|
|
</p>
|
|
|
|
|
|
<ol>
|
|
|
<li>
|
|
|
- Check the JavaScript console for errors, and make sure you've used an
|
|
|
- <em>onError</em> callback when calling <em>.load()</em> to log the result.
|
|
|
+ 在Javascript的Console中查找错误,并确定当你调用<em>.load()</em>的时候,使用了<em>onError</em>回调函数来输出结果。
|
|
|
</li>
|
|
|
<li>
|
|
|
- View the model in another application. For glTF, drag-and-drop viewers
|
|
|
- are available for
|
|
|
- <a href="https://gltf-viewer.donmccurdy.com/" target="_blank" rel="noopener">three.js</a> and
|
|
|
- <a href="http://sandbox.babylonjs.com/" target="_blank" rel="noopener">babylon.js</a>. If the model
|
|
|
- appears correctly in one or more applications,
|
|
|
- <a href="https://github.com/mrdoob/three.js/issues/new" target="_blank" rel="noopener">file a bug against three.js</a>.
|
|
|
- If the model cannot be shown in any application, we strongly encourage
|
|
|
- filing a bug with the application used to create the model.
|
|
|
+ 在别的应用程序中查看3D模型。对于glTF格式的模型来说,可以直接在下面的应用程序中进行查看:
|
|
|
+ <a href="https://gltf-viewer.donmccurdy.com/" target="_blank" rel="noopener">three.js</a>和
|
|
|
+ <a href="http://sandbox.babylonjs.com/" target="_blank" rel="noopener">babylon.js</a>。
|
|
|
+ 如果该模型能够在一个或者更多应用程序里正确呈现,请<a href="https://github.com/mrdoob/three.js/issues/new" target="_blank" rel="noopener">点击这里向three.js提交Bug报告</a>。
|
|
|
+ 如果模型不能在任意一个应用程序里显示,我们强烈鼓励你向我们提交Bug报告,告知我们你的模型是使用哪一款应用程序创建的。
|
|
|
+
|
|
|
</li>
|
|
|
<li>
|
|
|
- Try scaling the model up or down by a factor of 1000. Many models are
|
|
|
- scaled differently, and large models may not appear if the camera is
|
|
|
- inside the model.
|
|
|
+ 尝试将模型放大或缩小原来的1000倍。许多模型的缩放比例各不相同,倘若摄像机位于相机内,则大型模型将可能不会显示。
|
|
|
</li>
|
|
|
<li>
|
|
|
- Look for failed texture requests in the network tab, like
|
|
|
- <em>C:\\Path\To\Model\texture.jpg</em>. Use paths relative to your
|
|
|
- model instead, such as <em>images/texture.jpg</em> — this may require
|
|
|
- editing the model file in a text editor.
|
|
|
+ 在网络面板中查找失败的纹理贴图请求,像<em>C:\\Path\To\Model\texture.jpg</em>。使用相对于你的模型的文件路径,例如
|
|
|
+ <em>images/texture.jpg</em>——这或许需要在文本编辑器中编辑模型文件。
|
|
|
</li>
|
|
|
</ol>
|
|
|
|
|
|
- <h2>Asking for help</h2>
|
|
|
+ <h2>请求帮助</h2>
|
|
|
|
|
|
<p>
|
|
|
- If you've gone through the troubleshooting process above and your model
|
|
|
- still isn't working, the right approach to asking for help will get you to
|
|
|
- a solution faster. Post a question on the
|
|
|
- <a href="https://discourse.threejs.org/" target="_blank" rel="noopener">three.js forum</a> and, whenever possible,
|
|
|
- include your model (or a simpler model with the same problem) in any formats
|
|
|
- you have available. Include enough information for someone else to reproduce
|
|
|
- the issue quickly — ideally, a live demo.
|
|
|
+ 倘若你已经尝试经历了以上故障排除的过程,但是你的模型仍然无法工作,寻求正确的方法来获得帮助将使您更快地获得解决方案。
|
|
|
+您可以将您的问题发布到<a href="https://discourse.threejs.org/" target="_blank" rel="noopener">three.js forum</a>,
|
|
|
+ 同时,尽可能将你的模型(或者一个简单的、具有相同问题的模型)可用的包含在你能够使用的任何格式中,为其他人提供足够的信息,以便快速重现这个问题——最好是一个能够现场演示的Demo。
|
|
|
</p>
|
|
|
|
|
|
</body>
|