Spaces:
Running
Running
File size: 3,501 Bytes
18a9c33 11526b7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 |
import * as THREE from 'three';
const scene = new THREE.Scene();
scene.background = new THREE.Color(0xcccccc);
const camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 2000);
camera.position.set(0, 30, 50);
camera.lookAt(0, 3, 0);
const controls = new (<any>THREE).OrbitControls(camera);
const ambientLight = new THREE.AmbientLight(0xffffff, 1);
scene.add(ambientLight);
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
const stats = new Stats();
document.body.appendChild(stats.dom);
class Assets {
private static loadEggMtl(): Promise<THREE.Material[]> {
return new Promise((resolve, reject) => {
const loader: THREE.AnyLoader = new (<any>THREE).MTLLoader();
loader.load(
`models/Egg_from_Poly_uovo/Egg from Poly uovo.mtl`,
(materials) => {
materials.preload();
resolve(materials);
},
(xhr) => {},
reject
);
});
}
private static loadEggObj(materials: THREE.Material[]): Promise<THREE.Object3D> {
return new Promise((resolve, reject) => {
const loader: THREE.AnyLoader = new (<any>THREE).OBJLoader();
(<any>loader).setMaterials(materials);
loader.load(
`models/Egg_from_Poly_uovo/Egg from Poly uovo.obj`,
(object: THREE.Object3D) => {
resolve(object);
},
(xhr) => {
// c.log(`${ xhr.loaded / xhr.total * 100 }% loaded`);
},
(error) => {
c.error(error);
reject(error);
}
);
});
}
static async loadEgg(): Promise<THREE.Object3D> {
const materialCreator = await this.loadEggMtl();
return this.loadEggObj(materialCreator);
}
}
class Utils {
static boundingBox(o: THREE.Object3D): [THREE.Vector3, THREE.Vector3] {
const bbox = new THREE.Box3().setFromObject(o);
/// vv Just unpack it for easier console logging.
return [bbox.min, bbox.max];
}
}
(async () => {
/**
* scene construction
*/
const gridHelper = new THREE.GridHelper(100, 100);
scene.add(gridHelper);
const axesHelper = new THREE.AxesHelper(50);
scene.add(axesHelper);
const cube = new THREE.Mesh(
new THREE.BoxGeometry(1, 1, 1),
new THREE.MeshBasicMaterial({ color: 0x00ff00 })
);
cube.position.x = 7;
scene.add(cube);
{
const egg = await Assets.loadEgg();
c.log(egg);
egg.scale.setScalar(.2);
egg.rotateX(-Math.PI / 2);
// c.log(egg.rotation);
// c.log(Utils.boundingBox(egg));
const box = new THREE.BoxHelper(egg);
scene.add(box);
scene.add(egg);
///// Manually set the material, for fun.
// const eggFace = egg.getObjectByName("CallKit-IconMask") as THREE.Mesh;
// c.log(eggFace.material);
// (<THREE.MeshPhongMaterial>(eggFace.material)).color.set(0x000000);
}
// const geometry = new THREE.CylinderBufferGeometry( 0, 10, 30, 4, 1 );
// const material = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true } );
// for ( let i = 0; i < 500; i ++ ) {
// const mesh = new THREE.Mesh( geometry, material );
// mesh.position.x = Math.random() * 1600 - 800;
// mesh.position.y = 0;
// mesh.position.z = Math.random() * 1600 - 800;
// mesh.updateMatrix();
// mesh.matrixAutoUpdate = false;
// scene.add( mesh );
// }
})();
/**
* MAIN()
*/
function render() {
// const delta = clock.getDelta();
renderer.render( scene, camera );
}
function animate() {
requestAnimationFrame(animate);
render();
stats.update();
}
animate();
|