obj thingy works

This commit is contained in:
CJSatnarine
2025-02-27 18:53:37 -05:00
parent 4e308d78c9
commit 466115060a
6 changed files with 6568 additions and 197 deletions

6357
dist/assets/head-DD9xLfml.obj vendored Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

4
dist/index.html vendored
View File

@@ -3,7 +3,7 @@
<html lang="en">
<head>
<meta charset=" utf-8">
<title> First three.js app </title>
<title> CJ Satnarine website </title>
<style>
body {
@@ -11,7 +11,7 @@
}
</style>
<script type="module" crossorigin src="/assets/index-DLCEVn4m.js"></script>
<script type="module" crossorigin src="/assets/index-Co9VroNa.js"></script>
</head>
<body>

View File

@@ -3,7 +3,7 @@
<html lang="en">
<head>
<meta charset=" utf-8">
<title> First three.js app </title>
<title> CJ Satnarine website </title>
<style>
body {

36
main.js
View File

@@ -1,6 +1,9 @@
import * as THREE from 'three';
import { OBJLoader } from 'three/addons/loaders/OBJLoader.js';
// Vite import for files.
import headURL from "./models/head.obj?url";
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
@@ -9,20 +12,27 @@ renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setAnimationLoop(animate);
document.body.appendChild(renderer.domElement);
// Create Cube.
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ color: 0x962FFE });
const cube = new THREE.Mesh(geometry, material);
camera.position.z = 3;
// Add cube.
scene.add(cube);
camera.position.z = 5;
// Lighting.
const light = new THREE.HemisphereLight(0xffffbb, 0x080820, 1);
scene.add(light);
// OBJ loader.
const objectLoader = new OBJLoader();
objectLoader.load(
headURL,
function(object) {
scene.add(object);
},
function(xhr) {
console.log((xhr.loaded / xhr.total * 100) + '% loaded');
},
function(error) {
console.log('an error happened');
}
);
function animate() {
cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
renderer.render(scene, camera);
}
}

View File

@@ -1,12 +1,12 @@
{
"dependencies": {
"three": "^0.174.0"
"three": "^0.174.0"
},
"devDependencies": {
"vite": "^6.2.0"
},
"scripts": {
"build": "vite build",
"preview": "vite preview"
}
"vite": "^6.2.0"
},
"scripts": {
"build": "vite build",
"preview": "vite preview"
}
}