Skip to content
Snippets Groups Projects
Commit 41c88a92 authored by Thomas KANY's avatar Thomas KANY
Browse files

ajout voiture et fin foret

parent 52f7c0d3
No related branches found
No related tags found
No related merge requests found
Expand all Hide whitespace changes
Inline Side-by-side
ALVARIZA-BILLAR_DESERT_KANY/car.obj 0 → 100644
+ 15281
− 0
View file @ 41c88a92
This diff is collapsed.
ALVARIZA-BILLAR_DESERT_KANY/projet.js
+ 62
− 82
View file @ 41c88a92
......@@ -5,26 +5,21 @@
/*global THREE, $ */
import * as THREE from 'three';
import {OBJLoader} from 'three/addons/loaders/OBJLoader.js';
import {OrbitControls} from 'three/addons/controls/OrbitControls.js';
import { OBJLoader } from 'three/addons/loaders/OBJLoader.js';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import * as dat from 'https://cdn.jsdelivr.net/npm/dat.gui@0.7.9/build/dat.gui.module.js';
import {MTLLoader} from 'three/addons/loaders/MTLLoader.js';
import { MTLLoader } from 'three/addons/loaders/MTLLoader.js';
window.scene = new THREE.Scene();
// Variables globales
var camera, renderer;
var cameraControls;
var bevelRadius = 1.9;
var clock = new THREE.Clock();
var cylinder, sphere, cube;
var beton;
// var controls = {
// rotationY: Math.PI / 1 // valeur par défaut
// }
var car;
window.carSpeed = 50;
window.carMoving = true;
function fillScene() {
scene = new THREE.Scene();
......@@ -41,47 +36,43 @@ function fillScene() {
// GROUND
var texture = new THREE.TextureLoader();
var grassTexture = texture.load('textures/grass.png');
grassTexture.wrapS = THREE.RepeatWrapping;
grassTexture.wrapT = THREE.RepeatWrapping;
grassTexture.repeat.set(10, 10);
var solidGround = new THREE.Mesh(
new THREE.PlaneGeometry(100000, 100000, 1000, 1000),
new THREE.MeshLambertMaterial({map: grassTexture})
new THREE.MeshLambertMaterial({ map: grassTexture })
);
solidGround.rotation.x = -Math.PI / 2;
scene.add(solidGround);
scene.background = new THREE.CubeTextureLoader()
.setPath('textures/skybox/')
.load(['px.jpg', 'nx.jpg', 'py.jpg', 'ny.jpg', 'pz.jpg', 'nz.jpg']);
// Ajouter la route
// ROUTE
var roadTexture = texture.load('textures/road.jpg');
roadTexture.wrapS = THREE.RepeatWrapping;
roadTexture.wrapT = THREE.RepeatWrapping;
roadTexture.repeat.set(1, 10);
var road = new THREE.Mesh(
new THREE.PlaneGeometry(2000, 20000),
new THREE.MeshLambertMaterial({map: roadTexture})
new THREE.PlaneGeometry(2000, 100000),
new THREE.MeshLambertMaterial({ map: roadTexture })
);
road.rotation.x = -Math.PI / 2;
road.position.y = 20;
road.position.z = 20;
road.position.y = 10;
road.position.z = 10;
scene.add(road);
// Ajouter une dalle de béton
// DALLE DE BÉTON
var betonTexture = texture.load('textures/beton.jpg');
betonTexture.wrapS = THREE.RepeatWrapping;
betonTexture.wrapT = THREE.RepeatWrapping;
betonTexture.repeat.set(1, 1);
var betonMaterial = new THREE.MeshLambertMaterial({map: betonTexture});
var betonMaterial = new THREE.MeshLambertMaterial({ map: betonTexture });
beton = new THREE.Mesh(
new THREE.BoxGeometry(5000, 350, 5000),
......@@ -89,81 +80,75 @@ function fillScene() {
);
beton.position.set(-5000, 0, 2000);
beton.rotation.y = 0.46;
scene.add(beton);
// Ajouter les arbres
new MTLLoader()
.load('tree_bonus.mtl', function (materials) {
materials.preload();
new OBJLoader()
.setMaterials(materials)
.load('tree_bonus.obj', function (object) {
// Colorer l'arbre en vert sapin et enlever le reflet blanc
object.traverse(function (child) {
if (child.isMesh) {
child.material = new THREE.MeshLambertMaterial({color: 0x228B22}); // Vert sapin
child.material = new THREE.MeshLambertMaterial({ color: 0x006600 });
}
});
// Créer un rectangle de sapins à gauche de la route
var numTreesX = 20; // Nombre de sapins sur l'axe X
var numTreesZ = 100; // Nombre de sapins sur l'axe Z
var spacingX = 2000; // Espacement entre les sapins sur l'axe X
var spacingZ = 1000; // Espacement entre les sapins sur l'axe Z
var startX = 3000; // Position de départ sur l'axe X
var startZ = -50000; // Position de départ sur l'axe Z
// Position de départ sur l'axe Z pour déplacer les arbres plus au sud
// Arbres à gauche de la route
var numTreesX = 23, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000, startZ = -50000;
for (var x = 0; x < numTreesX; x++) {
for (var z = 0; z < numTreesZ; z++) {
var tree = object.clone();
tree.position.set(
startX + x * spacingX,
0,
startZ + z * spacingZ
);
tree.position.set(startX + x * spacingX + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
tree.scale.setScalar(400);
scene.add(tree);
}
}
// Créer plusieurs cercles de sapins
var numCircles = 10; // Nombre de cercles
var initialRadius = 10000; // Rayon initial du cercle
var radiusIncrement = 2000; // Incrément du rayon pour chaque cercle
var numTrees = 40; // Nombre de sapins par cercle
for (var j = 0; j < numCircles; j++) {
var radius = initialRadius + j * radiusIncrement;
for (var i = 0; i < numTrees; i++) {
var angle = (i / numTrees) * Math.PI * 2;
// Arbres à droite de la route
var numTreesX = 20, numTreesZ = 100, spacingX = 2000, spacingZ = 1000, startX = 3000, startZ = -50000;
startX = -7000;
for (var x = 0; x < numTreesX; x++) {
for (var z = 0; z < numTreesZ; z++) {
var tree = object.clone();
tree.position.set(
Math.cos(angle) * radius,
0,
Math.sin(angle) * radius
);
tree.position.set(startX - x * spacingX - 4000 + Math.random() * spacingX, 0, startZ + z * spacingZ + Math.random() * spacingZ);
tree.scale.setScalar(400);
scene.add(tree);
}
}
});
});
}
loadCar();
}
// Charger la voiture
function loadCar() {
new OBJLoader().load('car.obj', function (object) {
car = object;
car.scale.setScalar(200);
car.position.set(0, 30, -9000);
car.rotation.y = 0;
car.traverse(function (child) {
if (child.isMesh) {
child.material = new THREE.MeshStandardMaterial({ color: 0xff0000 });
}
});
scene.add(car);
});
}
function init() {
var canvasWidth = 846;
var canvasWidth = 846;
var canvasHeight = 494;
var canvasRatio = canvasWidth / canvasHeight;
// RENDERER
renderer = new THREE.WebGLRenderer({antialias: true});
renderer.gammaInput = true;
renderer.gammaOutput = true;
renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(canvasWidth, canvasHeight);
renderer.setClearColor(0xAAAAAA, 1.0);
......@@ -178,28 +163,24 @@ function init() {
cameraControls = new OrbitControls(camera, renderer.domElement);
cameraControls.target.set(0, 270, 0);
// GUI
var gui = new dat.GUI();
// Slider pour la rotation de la dalle de béton
// gui.add(controls, 'rotationY', 0, Math.PI * 2).step(0.01).name('Rotation Y').onChange(function (value) {
// if (beton) {
// beton.rotation.y = value;
// }
// });
}
function addToDOM() {
var container = document.getElementById('webGL');
var canvas = container.getElementsByTagName('canvas');
if (canvas.length > 0) {
container.removeChild(canvas[0]);
}
container.appendChild(renderer.domElement);
gui.add(window, 'carSpeed', 10, 200).step(5).name('Vitesse f1');
gui.add(window, 'carMoving').name('f1 on/off');
}
function animate() {
window.requestAnimationFrame(animate);
if (car && window.carMoving) {
car.position.z += window.carSpeed; // Avance sur l'axe Z
// Repositionner la voiture au début quand elle sort de la route
if (car.position.z > 50000) {
car.position.z = -50000;
}
}
render();
}
......@@ -212,9 +193,8 @@ function render() {
try {
init();
fillScene();
addToDOM();
animate();
} catch (e) {
var errorReport = "Your program encountered an unrecoverable error, can not draw on canvas. Error was:<br/><br/>";
$('#webGL').append(errorReport + e);
}
\ No newline at end of file
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment