CODEWITHSUNDEEP
three.jsgeometry
steveOw
steveOw

Reputation: 1021

THREE.js SphereBufferGeometry - Why so many vertices?

I am looking into how THREE builds a SphereGeometry and I see that it uses the function SphereBufferGeometry().

I am trying to understand why it creates the number of vertices which it does. For example if I specify the sphere to have 4 width segments and 4 height segments then THREE will define 25 vertices.

A sketch indicates that the "sphere" should have 4+8+8+4=24 separate triangles and if every triangle has 3 unshared vertices we get a total of 72 "virtual" vertices. But if we share each vertice between multiple triangles then there will be 1+4+4+4+1= 14 "real" vertices.

In the code there is this line:-

var vertexCount = ( ( widthSegments + 1 ) * ( heightSegments + 1 ) );

So this would explain where the number of vertices (4+1)*(4+1)=25 comes from. And this number (vertexCount) also determines the number of positions, normals and UVs that are created. But why is this many (25) vertices needed? As THREE is using indexing to share vertices across multiple triangles then why not just create 14 "real" vertices?

Edit

Practically the (wS+1)*(hS+1) vertexCount formula causes me a problem when trying to deform a sphere by applying random scalars to each vertex. If there were only 14 "real" vertices there would be no problem. But with 25 vertices I need to know which virtual vertices relate to the same real vertex so that all the virtual vertices can be assigned the same scalar value. Otherwise spatial gaps appear between some adjacent triangles.

Update

See WestLangley's answer.

Also note that the index of the (4x4 sized) SphereBufferGeometry has 72 elements which correspond to the 72 "virtual" vertices. Each element points to the corresponding 1 (out of 25) in-buffer vertices. Thus, if desired, the index can be used (in code) to read from the SphereBufferGeometry and write all 72 "virtual" vertices (actually all 72*3 = 216 vertex position coordinates) to a new initially-empty "flat" custom buffer.

Upvotes: 1

Views: 2236

Answers (1)

WestLangley
WestLangley

Reputation: 104773

SphereGeometry is BufferGeometry that is "indexed" -- vertices can be shared between the faces.

The reason the extra vertices are needed is because of the seams.

There is a seam on the side of the sphere, and there is a seam at both the north and south poles.

Duplicate vertices are needed along each seam because the UVs vary along the seams.

Each vertex can have any number of attributes, but if two vertices in the same location have at least one attribute that is different, then the vertices must be duplicated.

three.js r.143

Upvotes: 4

Related Questions