Three.js - Reload Scene from start

Question

I'm creating some kind of Visual Editor: I'm adding/deleting/transforming objects.

My initial scene only has a plane as floor (5000x5000).

I want to be able to "reload" the scene from start, that is to say to remove everything except the floor by clicking on the button "New".

How could it be possible ?

Answer 1

You could traverse the scene object, check what objects you have there and then remove them. If there are some Meshes you want to keep, set an attribute or name on them and check also for that name.

The following Example function clearScene() removes on call all Meshes from the scene that have the keepMe - attribute set to false or dont have one at all:

floor = new THREE.Mesh( /* ...  */ );
floor.userData = { keepMe: true };

// ...

function clearScene() {
    var to_remove = [];

    scene.traverse ( function( child ) {
        if ( child instanceof THREE.Mesh && !child.userData.keepMe === true ) {
            to_remove.push( child );
         }
    } );

    for ( var i = 0; i < to_remove.length; i++ ) {
        scene.remove( to_remove[i] );
    }
}

Jsfiddle: http://jsfiddle.net/L0rdzbej/138/

Removal-bugfix based on this answer by @gaitat