README-cn.md

three.js

JavaScript 3D library

项目的目标是创建一个易于使用的轻量级 3D 库。该库提供 <canvas>, <svg>, CSS3D 和 WebGL 渲染器。

示例 — 文档 — Wiki — 升级迁移 — 问答 — 论坛 — Gitter — Slack

用法

下载 压缩版本 library 并将其引入到 HTML 中，或者将其视为模块安装和导入， 或者自行构建，请查看如何自行构建 library。

<script src="js/three.min.js"></script>

This code creates a scene, a camera, and a geometric cube, and it adds the cube to the scene. It then creates a WebGL renderer for the scene and camera, and it adds that viewport to the document.body element. Finally, it animates the cube within the scene for the camera.

var camera, scene, renderer;
var geometry, material, mesh;

init();
animate();

function init() {

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

	scene = new THREE.Scene();

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

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

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

}

function animate() {

	requestAnimationFrame( animate );

	mesh.rotation.x += 0.01;
	mesh.rotation.y += 0.02;

	renderer.render( scene, camera );

}

If everything went well you should see this.

Change log

releases