typescriptthree.jsgeometrymeshface

Why I can't create Face3 in ThreeJS Typescript project

I am trying to create Mesh by using Face3. I am using Threejs in typescript project. There are several problems I am facing.

const points = [
     new Face3(-1, 1, -1),//c
     new Face3(-1, -1, 1),//b
     new Face3(1, 1, 1),//a

     new Face3(1, 1, 1),//a
     new Face3(1, -1, -1),//d
     new Face3(-1, 1, -1),//c

     new Face3(-1, -1, 1),//b
     new Face3(1, -1, -1),//d
     new Face3(1, 1, 1),//a

     new Face3(-1, 1, -1),//c
     new Face3(1, -1, -1),//d
     new Face3(-1, -1, 1),//b
]
let geometry = new Geometry();
for (const point of points) {
     geometry.faces.push(point);
}

First of all, I can't add this geometry into mesh. It gives me error that it is not a BufferGeometry

enter image description here

If I try to create a new BufferGeometry from Geomtery, I can't find property fromGeometry

enter image description here

If these kind of functions has been deprecated, then what is the exact alternative for this? Why there is no proper guideline or instruction available? Is there anyone who can suggest me better solution.

Solution

  • The class THREE.Geometry has been removed form core since r125 and was moved to examples/jsm/deprecated/Geometry.js. THREE.Face can be imported from the same module.

    Notice that it is not recommended to work with THREE.Geometry anymore. It's best to focus on THREE.BufferGeometry. The following topic at the three.js forum provides more background information: https://discourse.threejs.org/t/three-geometry-will-be-removed-from-core-with-r125/22401