Modèle:Utiliser des géométries

De OSWiki
Révision datée du 11 février 2018 à 17:31 par Acryline (discussion | contributions) (Page créée avec « ==Organisation des dossiers et fichiers== ==Fichiers Index.html et style.css== ==Code javascript== ===Le code=== {| |style="width: 50%;"|<source lang = 'javascript'> var... »)
(diff) ← Version précédente | Voir la version actuelle (diff) | Version suivante → (diff)
Aller à la navigation Aller à la recherche

Organisation des dossiers et fichiers

Fichiers Index.html et style.css

Code javascript

Le code

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

camera.position.z = 120;

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

var geometry =  new THREE.BoxGeometry(20, 20, 20);
var cube = forme(geometry,-80,50);	

var geometry =  new THREE.IcosahedronGeometry(15,0);
var icosahedre = forme(geometry,-40,50);

var geometry =  new THREE.CircleGeometry(15,32);
var cercle = forme(geometry,0,50);

var geometry =  new THREE.ConeGeometry( 15, 20, 32 );
var cone = forme(geometry,40,50);

var geometry =  new THREE.CylinderGeometry( 15, 15, 20, 32 );
var cylindre = forme(geometry,80,50);	

var geometry = new THREE.DodecahedronGeometry(15,0);
var dodeca = forme(geometry,-80,10);

var geometry = new THREE.OctahedronGeometry(15,0);
var octo = forme(geometry,-40,10);

var geometry =  new THREE.PlaneGeometry( 25, 25, 32 );
var plan = forme(geometry,0,10);

var geometry = new THREE.RingGeometry( 5, 20, 32 );
var ring = forme(geometry,40,10);

var geometry = new THREE.SphereGeometry( 15, 12, 12 );
var sphere = forme(geometry,80,10);

var geometry = new THREE.TetrahedronGeometry(15,0);
var tetra = forme(geometry,-80,-30);

var geometry = new THREE.TorusGeometry( 10, 3, 16, 100 );
var torus = forme(geometry,-40,-30);

var geometry = new THREE.TorusKnotGeometry( 10, 3, 100, 16 );
var knot = forme(geometry,0,-30);

var geometry =  new THREE.BoxGeometry(20, 20, 20);
geometry.vertices[2].x += -10;
geometry.vertices[2].y += -5;
var tordu = forme(geometry,40,-30);

var geometry = new THREE.IcosahedronGeometry(15,0);
geometry.vertices[2].x += -15;
geometry.vertices[2].y += -10;
geometry.vertices[8].x += -15;
geometry.vertices[8].y += -10;
var tordu2 = forme(geometry,80,-30);

var light = new THREE.PointLight(0xFF0000);
light.position.set(10, 0, 25);
scene.add(light);

function forme(geo,posX,posY)
{
var material = new THREE.MeshNormalMaterial();
var obj = new THREE.Mesh(geo, material);
obj.position.x = posX;
obj.position.y = posY;
scene.add(obj);    
return obj;	
}

function animate() {
requestAnimationFrame( animate );

cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
icosahedre.rotation.x += 0.01;
icosahedre.rotation.y += -0.01;
cercle.rotation.x += -0.01;
cercle.rotation.y += 0.01;
cone.rotation.x += 0.01;
cone.rotation.y += 0.01;
cylindre.rotation.x += 0.01;
cylindre.rotation.y += -0.01;
dodeca.rotation.x += -0.01;
dodeca.rotation.y += 0.01;
octo.rotation.x += 0.01;
octo.rotation.y += 0.01;
plan.rotation.x += -0.01;
plan.rotation.y += -0.01;
ring.rotation.x += 0.01;
ring.rotation.y += 0.01;
sphere.rotation.x += -0.01;
sphere.rotation.y += 0.01;
tetra.rotation.x += 0.01;
tetra.rotation.y += -0.01;
torus.rotation.x += -0.01;
torus.rotation.y += 0.01;
knot.rotation.x += -0.01;
knot.rotation.y += -0.01;
tordu.rotation.x += -0.01;
tordu.rotation.y += 0.01;
tordu2.rotation.x += -0.01;
tordu2.rotation.y += 0.01;

renderer.render( scene, camera );
}
animate();
Spécial:IframePage/Geometrie

Analyse du code javascript