This fork of three.js r87 is a "sparse" customized build created for a specific purpose. Many, many features have been removed in the interest of producing a much slimmer library. This fork is not intended as a general-purpose replacement for the real three.js library and its changes are not meant to be integrated back into the main project.
Documentation, tests and examples have been kept as-is, but do not reflect this particular fork's features.
Parts that've been removed are:
- Most built-in geometries
- Most built-in materials
- Lights
- Audio framework
- Animation framework
- Legacy layer/deprecation warnings
- WebGL shadow maps, sprites, flares, lights, VR
The aim of the project is to create an easy to use, lightweight, 3D library. The library provides <canvas>, <svg>, CSS3D and WebGL renderers.
Examples — Documentation — Wiki — Migrating — Help
Download the minified library and include it in your html, or install and import it as a module, Alternatively see how to build the library yourself.
<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 scene, camera, renderer;
var geometry, material, mesh;
init();
animate();
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.z = 1000;
geometry = new THREE.BoxGeometry( 200, 200, 200 );
material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
renderer = new THREE.WebGLRenderer();
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.