three.js

$4/yr

Single Licence: a single website (personal, client), or intranet site project - Details

Extended Licence: a website (commercial, personal, client), or internet site project - Details

Rated

Be the first to review this.

Save for later

Save this link to facebook.

Get Social

Hit like and share it with others.

CREATED

21-Feb-2021

LAST UPDATED

21-Feb-2021

Compatible Browsers

,

DOCUMENTATION

LAYOUT

FILES INCLUDED

zip,

Seller Store

github

github

Contact Me
495

Sales

0

Comments

495+

Downloads

0

Rated Points

three.js

JavaScript 3D library
The aim of the project is to create an easy to use, lightweight, 3D library with a default WebGL renderer. The library also provides Canvas 2D, SVG and CSS3D renderers in the examples.
Examples —
Documentation —
Wiki —
Migrating —
Questions —
Forum —
Slack —
Discord
Usage
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.
import * as THREE from ‘./js/three.module.js’;

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

init();

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 );
renderer.setAnimationLoop( animation );
document.body.appendChild( renderer.domElement );

}

function animation( time ) {

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

renderer.render( scene, camera );

}
If everything went well, you should see this.
Cloning this repository
Cloning the repo with all its history results in a ~2 GB download. If you don’t need the whole history you can use the depth parameter to significantly reduce download size.
git clone –depth=1 https://github.com/mrdoob/three.js.git
Change log
Releases

Comments and Discussions



Reviews



Copyrights © 2024-2025 All Rights Reserved