CODEWITHSUNDEEP
javascript3dthree.js
Leprosy
Leprosy

Reputation: 1135

Three.js - Updated geometry is not rendering changes

I'm having a little issue here. I have a THREE.Line object, with a material and a geometry. The init method pushes 2 vertices to the geometry, add the Line to the scene, the line is rendered just fine.

But I have an event listener... Every click in the canvas will add another vertex. But when the scene is rendered, only the original 2 vertices are rendered. I've output a dump of scene.children and I'm sure that the Line is in the scene, and the geometry has changed.

In the documentation it says something about applying:

geometry.dynamic = true
geometry.verticesNeedUpdate = true

But these didn't work either.

Upvotes: 2

Views: 4035

Answers (1)

WestLangley
WestLangley

Reputation: 104763

See the three.js Wiki: https://github.com/mrdoob/three.js/wiki/Updates

You can only update content of buffers, you cannot resize buffers (this is very costly, basically equivalent to creating new geometry).

You can emulate resizing by pre-allocating larger buffer and then keeping unneeded vertices collapsed / hidden.

Geometries are specified via vertex buffer objects, which have fixed sizes. You can create and delete buffers, but you cannot resize them.

As a workaround, you could create a geometry with extra vertices and collapse the unwanted ones into a single point.

three.js r.52

EDIT: A newer approach is described in Drawing a line with three.js dynamically.

Upvotes: 4

Related Questions