Basics🔗
In three.js there are there basic core building blocks
A scene which will house all the 3D objects and cameras.
const scene = new THREE.Scene();
A camera which displays the 3D objects in any sort of angle required.
const camera = new THREE.PerspectiveCamera(
75,
sizes.width / sizes.height,
0.1,
100
);
A 3D object, also known as a mesh
. A mesh
is comprised of some geometry and a texture.
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ map: colorTexture });
const mesh = new THREE.Mesh(geometry, material);
The camera and 3D objects need to be added to the scene
.
scene.add(mesh);
scene.add(camera);
Things get a lot more interesting when we bring controls and animations into the mix. But this is the core of how three.js works.
Cameras🔗
2021-08-28 2021-08-30 2021-09-05 2021-09-09