Jump to content
ThoSzy

Write a reverse function for mesh removing

Recommended Posts

I've got a function that create mesh when you click on another. On the click, 2 or 3 mesh are created and go to their positions. Know i would like to do the reverse function : when the mesh are deployed, and you click anoter time on the mesh, the previously created mesh go back and are removed from the scene.

Here is my first function :

 

function sortiSphere(element, obj) {


    var matStdParams = {
        roughness: 1,
        metalness: 0.8,
        color: element.group,
        emissive: element.group,
        emissiveIntensity: 0.5
    };


    var sphereMaterial2 = new THREE.MeshStandardMaterial(matStdParams);

    var mesh = new THREE.Mesh(sphereGeometry, sphereMaterial2);

    mesh.position.x = x;
    mesh.position.y = y;
    mesh.position.z = z;

    mesh.userData.children = element.children;
    mesh.userData.name = element.label;
    mesh.userData.rang = element.rang;
    mesh.userData.def = element.définition;
    mesh.userData.posx = element.posx;
    mesh.userData.posy = element.posy;
    mesh.userData.posz = element.posz;
    mesh.userData.parent = obj;
    mesh.userData.cartabs = element.cartabs;
    mesh.position.normalize();
    mesh.position.multiplyScalar(1 / element.rang);
    mesh.scale.set(1 / (element.rang / 2), 1 / (element.rang / 2), 1 / (element.rang / 2))

    mesh.position.x = obj.position.x;
    mesh.position.y = obj.position.y;
    mesh.position.z = obj.position.z;

    var x = element.posx;
    var y = element.posy;
    var z = element.posz;


    new TWEEN.Tween(mesh.position).to({
            x: x,
            y: y,
            z: z
        }, 1000)
        .easing(TWEEN.Easing.Elastic.Out).start();


    console.log(mesh);

    scene.add(mesh);
    lesMesh.push(mesh)


    // lines
    var material = new THREE.LineBasicMaterial({
        color: 0xffffff
    });

    var geometry = new THREE.Geometry();
    geometry.vertices.push(
        obj.position,
        new THREE.Vector3(x, y, z)
    );

    var line = new THREE.Line(geometry, material);
    scene.add(line);

    gen1 = [];
    gen2 = [];
    gen3 = [];
    gen4 = [];
    gen5 = [];


    obj.userData.bool = true;

};

 

Notice that the mesh contain a information about their state : userData.bool (true if deployed, false if not)

Now, how do I tell them to go back ?

Here is what I got for now :

    function deleteSphere(element, obj) {
    console.log("--- deleteSphere / debut fonction")



    for (i = 0; gen1.length > i; i++) {

        if (gen1[i].userData.children) {


            for (j = 0; gen1[i].userData.children.length > j; j++) {

                console.log(gen2[i][j]);
                scene.remove(gen2[i][j]);}

        } else {

            scene.remove(gen1[i])

           console.log(gen1[i].userData.children)
        }
    }
};

Thanks for your time

Share this post


Link to post
Share on other sites

It looks like you use that tween function to move something, so figure out where you want to move it and use that function to do so.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...