1. 产品
  2.   3D
  3.   JavaScript
  4.   three.js  

three.js  

 
 

用于 3D 文件格式的 JavaScript 库

用于通过免费 3D 库读取、写入和渲染 WebGL、FBX、Collada 以及 OBJ 文件格式的开源 JavaScript API。

three.js 是一个开源的易于使用的纯 JavaScript 3d 库，它使软件开发人员能够呈现 WebGL 文件。 three.js 库为 FBX、Collada 以及 OBJ 等多种文件格式提供加载器，但推荐的导入和导出数据格式是 glTF。 glTF 文件格式的优点是它非常紧凑，可以轻松传输并且加载速度非常快。

该库支持与 3D 模型相关的几个重要功能，例如创建场景、加载 3D 模型、创建文本、绘制线条设置相机、创建几何立方体、向场景添加立方体、渲染场景、向元素添加视口、还有很多。 three.js 库中使用了不同的相机。

Previous Next

三.js 入门

安装 three.js 最简单的方法是使用 npm。请使用以下命令进行顺利安装。 

通过 NPM 安装 three.js

npm install --save three

使用 JavaScript 创建场景

开源库 three.js 支持创建 3D 场景，以便在他们自己的 JavaScript 应用程序中旋转立方体。要使用 three.js 显示任何内容，我们需要一个场景、相机和渲染器。您可以使用不同的相机及其属性来完成场景。接下来，您可以使用渲染器实例并设置我们希望它渲染应用程序的大小。您可以保持较低或较高的分辨率。最后，将 renderer 元素 (<canvas>) 添加到 HTML 文档中。您可以使用 BoxGeometry 轻松创建立方体并使用材质对其进行着色。之后，您需要一个可以插入场景并根据需要移动的Mesh。

The open source library three.js has provided support for creating a 3D scene for spinning a cube inside their own JavaScript application. To display anything with three.js we require a scene, camera, and 渲染器. You can use different cameras and their attribute to complete the scene. Next, you can use a 渲染器 instance and set the size at which we want it to render our app. You can keep the lower or higher resolution. Lastly, you add the 渲染器 element (<canvas>) to your HTML document. You can easily create a cube by using BoxGeometry and using the material to color it. After that, you need a Mesh that can be inserted into the scene and moved according to your need.

The open source library three.js has provided support for creating a 3D scene for spinning a cube inside their own JavaScript application. To display anything with three.js we require a scene, camera, and renderer. You can use different cameras and their attribute to complete the scene. Next, you can use a renderer instance and set the size at which we want it to render our app. You can keep the lower or higher resolution. Lastly, you add the renderer element (<canvas>) to your HTML document. You can easily create a cube by using BoxGeometry and using the material to color it. After that, you need a 网 that can be inserted into the scene and moved according to your need.

通过 JavaScript 加载 3D 模型

开源的three.js 库允许软件程序员在他们自己的应用程序中加载3D 模型，只需几行JavaScript 代码。 3D 模型有数百种文件格式。每个模型都有不同的用途、杂项功能和不同的复杂性。首先，您需要有一个加载器，然后，您将能够加载场景。

在图中画线

开源库 three.js 提供了在其自己的 JavaScript 应用程序中绘制线或圆的支持。首先，我们需要设置渲染器、场景和相机。之后，您需要定义材质并且可以使用 LineBasicMaterial 或 LineDashedMaterial。在材质之后，我们将需要带有一些顶点的几何体。在每对连续的顶点之间画线。

 中国人