Three.js: Difference between revisions

Revision as of 11:41, 30 April 2022

Revision as of 04:02, 24 May 2022

Line 65:

<syntaxhighlight lang="javascript">

import * as THREE from 'js/three.module.js';

// init

var camera, scene, renderer;

var geometry, material, mesh;

rendererconst camera = new THREE.setSizePerspectiveCamera( 70, window.innerWidth, / window.innerHeight, 0.01, 10 );

init();

camera.position.z = 1;

animate();

const scene = new THREE.Scene();

function init() {

cameraconst geometry = new THREE.PerspectiveCameraBoxGeometry( 700.2, window0.innerWidth / window.innerHeight2, 0.01, 102 );

const material = new THREE.MeshNormalMaterial();

camera.position.z = 1;

sceneconst mesh = new THREE.SceneMesh( geometry, material );

scene.add( mesh );

geometryconst renderer = new THREE.BoxGeometryWebGLRenderer( 0.2,{ 0.2,antialias: 0.2true } );

renderer.setSize( window.innerWidth, window.innerHeight );

material = new THREE.MeshNormalMaterial();

renderer.setAnimationLoop( animation );

document.body.appendChild( renderer.domElement );

// animation

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

scene.add( mesh );

function initanimation( time ) {

renderer = new THREE.WebGLRenderer( { antialias: true } );

renderer.setSize( window.innerWidth, window.innerHeight );

document.body.appendChild( renderer.domElement );

mesh.rotation.x += 0.01time / 2000;

}

mesh.rotation.y += 0.02time / 1000;

function animate() {

requestAnimationFrame( animate );

mesh.rotation.x += 0.01;

mesh.rotation.y += 0.02;

renderer.render( scene, camera );