Create Three.js Triangles from Vertices array with a function - three.js

Question

I'm new to JS, THREE.js and want to make a function that takes:

every 3 values to make a new vertex,
every 3 vertices, makes a new THREE.Triangle(ta, tb, tc);
record all of those triangles in an Array
find the total sum of each Triangle.getArea()

Here's what I have so far:

// An empty Array to store all the Triangles
   var triangles = [];

//  pos is an array that holds all the points/vertices -- there's 72 values total 
   var pos = threeMesh1.geometry.attributes.position;
  
   function makeTriangle(ta, tb, tc){
   
    for (i = 0; i < pos.count; i++) {
// For *every 3 instances*, assign the values to ta, tb, tc,
    ta = new THREE.Vector3( pos.getX(i), pos.getY(i), pos.getZ(i)); //posX(0),posY(0),posZ(0)
    tb = new THREE.Vector3( pos.getX(i+=1), pos.getY(i+=1), pos.getZ(i+=1) );//posX(1),posY(1),posZ(1)
    tc = new THREE.Vector3( pos.getX(i+=2), pos.getY(i+=2), pos.getZ(i+=2));//posX(2),posY(2),posZ(2)
   //the next set should be i =(3,4,5) (6,7,8) (9,10,11), etc.

// Make a new triangle Object
    tri = new THREE.Triangle(ta, tb, tc);
 

// Add new triangle to initial "triangles" array
    triangles.push(tri);
    
   }
}
makeTriangle(triangles);  
console.log(triangles); // returns [Triangle, Triangle, Triangle]

How do I make the every 3 instances inside the for loop work? As of right now instead of 0,1,2 / 3,4,5 /6,7,8 it's giving 0,3,6,9, etc.

What’s your question?

M -
– M -

2021-01-04 19:00:58 +00:00
Commented Jan 4, 2021 at 19:00 — M -
– M -, Commented Jan 4, 2021 at 19:00
I edited the question above, thank you!

gja2nd
– gja2nd

2021-01-04 21:32:47 +00:00
Commented Jan 4, 2021 at 21:32 — gja2nd
– gja2nd, Commented Jan 4, 2021 at 21:32

gja2nd · Accepted Answer · 2021-01-10 04:00:15Z

I was actually able to find a solution via the three.js Discourse here. Hope this can help anyone else!

var triangles = [];
var pos = threeMesh1.geometry.attributes.position;

var a = new THREE.Vector3(); // for re-use
var b = new THREE.Vector3(); // for re-use
var c = new THREE.Vector3(); // for re-use
// var normals = [];
var faces = pos.count / 3; // count = 8 triangles

function makeTriangle() {
for (let i = 0; i < faces; i++){
var tri = new THREE.Triangle(); // for re-use
  a.fromBufferAttribute(pos, i * 3 + 0);
  b.fromBufferAttribute(pos, i * 3 + 1);
  c.fromBufferAttribute(pos, i * 3 + 2);
  tri.set(a, b, c);
//   let n = new THREE.Vector3();
//   tri.getNormal(n);
  let area_sum = tri.getArea();
//   normals.push(n);

  // Add new triangle to initial "triangles" array
    triangles.push(tri);
    console.log(area_sum);
    }   
    
}  
makeTriangle(triangles);  
console.log(triangles); // returns [Triangle, Triangle, Triangle]

Collectives™ on Stack Overflow

Create Three.js Triangles from Vertices array with a function - three.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related