CODEWITHSUNDEEP
javascriptopengl-esthree.jswebgl
theblueone
theblueone

Reputation: 679

Accessing all of the vertices on one face of a cube in three.js

I have a cube and am trying to transform the x position of all of the coordinates on one face of the cube. Currently my approach is:

var wDepth = 200;
var hDepth = 200;
var geo = new THREE.CubeGeometry( 20, 40, 40, 20, wDepth, hDepth);

        for ( var i = 0; i < wDepth; i++ ) {
            for ( var j = 0; j < hDepth; j++ ){
                var index = j * wDepth + i;
                geo.vertices[index].x += heightData[ index ];
            }
        }

When I view my model, it appears I'm missing an entire row from the face (only the first point on the last row is transformed). How can I iterate over an entire face of this cube so that I can access all of the points?

Upvotes: 2

Views: 1974

Answers (1)

GuyGood
GuyGood

Reputation: 1377

Well, i guess first of all, i think you should correct the title of your question, because it is not one Face, it is one side of the cube.
Anyway, concnering your question, you could hard code something if you experiment with the structure that three.js generates the cube in. Like if maybe the first 500 faces in the faces array are from one side, or the first few hundred vertices belong to one side. But i am not sure if this works at all. If you want to have a good general approach, you should check for the face normals of each face, because they are pointing in the right direction that you want. some pseudo-code would be something like: (face index = face.a, face.b, face.c and is a reference to the vertex for the specific triangle)

for all geometry.faces 
if (geometry.face[i].normal.equals{Vec3(1,0,0}) then
       for each geometry.face[i].index 
       geometry.vertices[geometry.face[i].index].x = 4;

this way, you get all the faces that face in a specific direction (in this example positiv x) and then you change the vertices x coordinate of those faces to a hard-coded value of 4. I think something like this should work.

Upvotes: 3

Related Questions