CODEWITHSUNDEEP
javascriptthree.js
SDEscobedo
SDEscobedo

Reputation: 595

Mesh is not updating when changed from gui in threejs

I made a line mesh with elliptical shape, representing the orbit wiht eccentricity e, and semi-major axis a. The mesh is a child of a group called orbitGroup that contains other objects. Also, I added a gui to change this parameters. Every time gui changes it calls the next function:

 function ElementsUpdate(){

            scene.remove(orbitGroup);
            orbitGroup.remove(Orbit);
            Orbit = undefined;
            Orbit = new THREE.Line( GetGeometryOrbit(GetOrbitLine(a,e,100)), materialOrbit);
            orbitGroup.add(Orbit);
            scene.add(orbitGroup);     

        }

The mesh (Orbit) is being created successfully. However the it does not update. I'm aware that setGeometry method is not working anymore. Any solution? I am replacing the mesh because replacing only the geometry seems to be more complicated. Thanks beforehand for the help.

The project is in this link

Upvotes: 0

Views: 454

Answers (1)

TheJim01
TheJim01

Reputation: 8876

You should be able to replace the vertex (position) buffer and call it a day.

function ElementsUpdate(){
  let points = GetOrbitLine(a,e,100).getPoints(); // THREE.Curve.getPoints
  Orbit.geometry.setFromPoints( points ); // replaces the position buffer
}
  1. Curve.getPoints gives you an array of the points on your elipse.
  2. BufferBgeometry.setFromPoints replaces the position buffer, derived from your array of points.
  3. Because it replaces the buffer (and the BufferAttribute) You should not need to mark anything as needing re-sent to the GPU.

Upvotes: 1

Related Questions