What is the difference between points and vertices

Questions
1

Hi,

I would like to know what the difference is between points and vertices within the context of Three.js.

2

Points three.js docs are objects derived from Object3D three.js docs.

Vertices are the positions of triangles (corners) that form geometries. For example, PlaneGeometry three.js docs

See source three.js/PlaneGeometry.js at e48fc94dfeaecfcbfa977ba67549e6108b370cbf ¡ mrdoob/three.js ¡ GitHub

this.setIndex( indices );
this.setAttribute( 'position', new Float32BufferAttribute( vertices, 3 ) );

Note when you read something on the net, to which revision of three.js it belongs. The “old” geometry no longer exists since revision 125. THREE.Geometry will be removed from core with r125 All geometries are now created as BufferGeometry.

You can find simple examples in the Collection of examples from discourse.threejs.org
e.g. in the BeginnerExample BeginnerExample.
An example for Points is still missing there.

Here points are used (2018) Interaction with Points

From the docs:
three.js examples

click 2021-04-04 18.42.52 to see the source.

1 Like
3

Thank you very much for the extensive answer and the time you have put into with adding all these sources. But I still don’t get it. Reason for my confusion is this sample code I had found somewhere.

 const geometry = new THREE.BufferGeometry()
 const points = [];
 points.push( new THREE.Vector3( 0, 0, 0) );
 points.push( new THREE.Vector3( 0,1,0) );
 geometry.setFromPoints( points );

This code adds a vertical line on the Y-axis. Because of the two vertices within the points array. The function “setFromPoints” in this scenario, sounds like it could just as well could be called “setFromVertices”.

Is it correct that vertices can be a property of the Points object (and perhaps any Object3D object)? I am still a confused because a Points object can contain geometry but it also can be used as geometry by itself via the setFromPoints function on the BufferGeometry object. But perhaps this confusion comes from my lack of clearly understanding the geometry part of ThreeJS.

4

There is always confusion when terms are used differently. In your code snippet, the array const points = []; could be named differently. But it refers to a method of BufferGeometry three.js docs. This method .setFromPoints( ) expects an array of Vector3 as argument. The components .x .y .z of these vectors are then the vertices or just the positions in the BufferGeometry. More precisely .setAttribute( ‘position’, …

There is another example of concept confusion in the BufferGeometry, which I also fell for in the beginning. It is .groups

You must not confuse it with Group three.js docs.

For geometry.setFromPoints( points ); there are some examples in my collection.

Just have a look.
LineRelatedSquare
TrailsOverGlobe

and some more.

1 Like
5

Examples from the docs.

three.js examples
three.js examples