Mesh editing: Faces
Implemented editing the mesh of the object by moving the face. But this solution is very resource-intensive. It can be seen when there are a lot of triangles in the object. The reason for this is that I create an auxiliary triangle for each triangle of the object, and when the triangle moves, I delete them all and create them again.
As a solution, I decided to make an auxiliary triangle only for the triangle that I am going to move. Now for this I realized the creation of such a triangle with the movement of the mouse. This will highlight the triangle that you can select
transformMesh( editHelper ) { if( this.mode === 'Vertices'){ this.moveVertex( editHelper.object.userData.vertexNumber, editHelper.object.position ); } if( this.mode === "Faces" ){ let sphereName = editHelper.object.name; let face = editHelper.object.parent.getObjectByName( editHelper.object.name.replace('Sphere','') ); let sphere = editHelper.object; let shift = sphere.position; shift.subVectors( sphere.position, face.userData.baryCenter ) face.position.set( shift.x, shift.y, shift.z ); let attrArray = face.geometry.attributes.position.array; let vertices = []; for (let i = 0; i < attrArray.length; i += 3 ) { vertices.push( new Vector3( attrArray[i], attrArray[i+1], attrArray[i+2])); } let verticesNumbers = face.userData.verticesNumbers; for (let i = 0; i < verticesNumbers.length; i ++ ) { let pointNumber = verticesNumbers[ i ]; let point = vertices[ i ].clone(); let pointPosition = point.add( face.position.clone() ).clone(); this.moveVertex( pointNumber, pointPosition ); this.removeMeshHelpers(); this.createMeshHelpers(); let sphere = this.ta_Scene.scene.getObjectByName( sphereName ); this.ta_Scene.transformControls.attach( sphere ); } } }