6.5 万 Star!开发 3D 网页项目的必备工具
开源前哨
共 3208字,需浏览 7分钟
·
2020-12-25 00:27
【导语】:Three.js
是一个易于上手的轻量级 Javascript API 库,主要用于数据可视化、VR 演示等 3D 的图形展示。它在 GitHub 获得了6.5 万 Star
。
简介
Three.js
可以创建各种 3D 图形,点、线、文字、几何体、立体文字等,并可以设置光影特效、纹理特效、动画特效等。定位方式采用右手坐标系定位。默认使用WebGL
渲染器,同时还提供了Canvas 2D
、SVG
和CSS3D
渲染器。当浏览器过于老旧或因为其他原因不支持WebGL
方式时,使用其他渲染方式进行渲染。
Three.js 官网有丰富的使用范例。
(截图来自 three.js 官网)
下载安装
Three.js
的源码地址是:
https://github.com/mrdoob/three.js
可使用以下方法安装:
(1) npm安装
在当前项目文件夹中打开终端窗口:
npm install --save three
下载安装成功后,在项目中导入
// 方式 1: 导入整个 three.js核心库
import * as THREE from 'three';
const scene = new THREE.Scene();
// 方式 2: 仅导入你所需要的部分
import { Scene } from 'three';
const scene = new Scene();
(2) CDN引入
将 three.js 文件上传到你自己的服务器,或使用第三方CDN。如下所示: