README

JavaScript 3D 库

该项目的目标是创建一个易于使用、轻量级、跨浏览器的通用 3D 库。当前构建只包含 WebGL 渲染器，但 WebGPU（实验性）、SVG 和 CSS3D 渲染器也作为附加组件可用。

示例 — 文档 — 手册 — 维基 — 迁移指南 — 问题 — 论坛 — Discord

用法

此代码创建了一个场景、一个相机和一个几何立方体，并将立方体添加到场景中。然后为场景和相机创建了一个 WebGL 渲染器，并将其添加到 document.body 元素中。最后，它在场景中为相机动画化立方体。

import * as THREE from 'three';

// init

const camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10 );
camera.position.z = 1;

const scene = new THREE.Scene();

const geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
const material = new THREE.MeshNormalMaterial();

const mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );

const renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setAnimationLoop( animation );
document.body.appendChild( renderer.domElement );

// animation

function animation( time ) {

	mesh.rotation.x = time / 2000;
	mesh.rotation.y = time / 1000;

	renderer.render( scene, camera );

}

如果一切顺利，你应该会看到这个。

克隆此存储库

使用包含所有历史记录的存储库克隆将导致约 2 GB 的下载。如果你不需要整个历史记录，可以使用 depth 参数来显著减小下载大小。

git clone --depth=1 https://github.com/mrdoob/three.js.git

变更日志

版本发布

devarul / three.js

维护者

详细信息

README

JavaScript 3D 库

用法

克隆此存储库

变更日志