Why does the .getAttrbute('position').array of a plane return a vector longer than its widthSegments multiplied by its heightSegments in Three.js?

user_6702482 0
Viewed 27

I'm new to three.js and 3d in general, but here's a example:

const geometry = new Three.PlaneBufferGeometry(1, 1, 8, 8)

let positions = this.geometry.getAttribute('position').array

console.log(positions.length)

Just from my basic understanding, I would guess before seeing the result is that positions.length is 8*8*3 or 192 elements wide because as far as I know, a vertex in three.js takes a block of 3 values (x, y, z?), then the next vertex takes 3, and so on, travelling along the vector of values. A plane is formed of these vertices, and I would assume (again, pre-run) this plane has 64 vertices.

However, when I run this, I get a logged value of 243.

What am I misunderstanding here? 243 doesn't seem like a cleanly divisible number any way I look at it. My ultimate goal is to manipulate each vertex by some amount along the Z-axis, before the render.

three.js
1 Answers

To form 8 segments, there must be 9 points.

Thus, in case of an indexed geometry (PlaneGeometry is of that type), the amount of points per dimension is amount_of_segments + 1.

So, in your case, a plane of 8 x 8 segments will have (8 + 1) * (8 + 1) = 9 * 9 = 81 vertices. And the length of geometry.attributes.position.array will be 81 * 3 = 243.

user_40455020
Related