FAQ.html 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <base href="../../../" />
  6. <script src="list.js"></script>
  7. <script src="page.js"></script>
  8. <link type="text/css" rel="stylesheet" href="page.css" />
  9. </head>
  10. <body>
  11. <h1>常见问题([name])</h1>
  12. <h2>哪一种三维物体格式能够得到最好地支持?</h2>
  13. <div>
  14. <p>
  15. 推荐使用glTF(gl传输格式)来对三维物体进行导入和导出,由于glTF这种格式专注于在程序运行时呈现三维物体,因此它的传输效率非常高,且加载速度非常快。
  16. </p>
  17. <p>three.js同样也为其它广受欢迎的格式(例如FBX、Collada以及OBJ等)提供了载入工具。即便如此,你应当还是首先尝试着在你的项目中建立一个基于glTF的工作流程。
  18. 了解更多详细信息,请查看[link:#manual/introduction/Loading-3D-models loading 3D models]。
  19. </p>
  20. </div>
  21. <h2>为什么在示例中会有一些和viewport相关的meta标签?</h2>
  22. <div>
  23. <div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">meta</span> <span class="pl-e">name</span>=<span class="pl-s"><span class="pl-pds">"</span>viewport<span class="pl-pds">"</span></span> <span class="pl-e">content</span>=<span class="pl-s"><span class="pl-pds">"</span>width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0<span class="pl-pds">"</span></span>&gt;</pre></div>
  24. <p>这些标签用于在移动端浏览器上控制视口的大小和缩放(页面内容可能会以与可视区域不同的大小来呈现)。</p>
  25. <p>[link:https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html Safari: Using the Viewport]</p>
  26. <p>[link:https://developer.mozilla.org/en/Mobile/Viewport_meta_tag MDN: Using the viewport meta tag]</p>
  27. </div>
  28. <h2>如何在窗口调整大小时保持场景比例不变?</h2>
  29. <p>
  30. 我们希望所有的物体,无论它们距离摄像机有多远,都能呈现相同尺寸,即使是在窗口被重新调整大小的时候。
  31. 解决这个问题的关键,是一个很重要的公式:给定距离,求可见高度
  32. <code>
  33. visible_height = 2 * Math.tan( ( Math.PI / 180 ) * camera.fov / 2 ) * distance_from_camera;<br>
  34. </code>
  35. 如果我们以一定的百分比增加了窗口的高度,那我们所想要的结果便是所有距离的可见高度都增加相同的百分比。
  36. 这并不能通过改变摄像机的位置来实现,相反,你得改变摄像机的视野角度(FOV)。这是个示例:[link:http://jsfiddle.net/Q4Jpu/ Example].
  37. </p>
  38. <h2>为什么我的物体的一部分是不可见的?</h2>
  39. <p>
  40. 这可能是由于面剔除而导致的。面是具有朝向的,这个朝向决定了哪边是正面或者哪边是背面。
  41. 在正常情况下,渲染时会将背面进行剔除。要查看这是不是你所遇到的问题,请将material的side更改为THREE.DoubleSide。
  42. <code>material.side = THREE.DoubleSide</code>
  43. </p>
  44. </body>
  45. </html>