Why am I unable to remove all children if I delete half of them in this code? I keep getting an error saying child is not defined, even though I have declared it. Each node in my code has children spheres (nodes) and edges (lines), but when I try to delete them only the nodes get removed. Can anyone assist me with this issue, please?
function onMouseClick( e ) {
mouseVector.x = 2 * (e.clientX / containerWidth) - 1;
mouseVector.y = 1 - 2 * ( e.clientY / containerHeight );
var raycaster = projector.pickingRay( mouseVector.clone(), camera ),
intersects = raycaster.intersectObjects( scene.children );
for( var i = 0; i < intersects.length; i++ ) {
//INTERSECTED = intersects[0].object;
INTERSECTED = intersects[i].object;
//obj = intersection.object;
alert(INTERSECTED.id);
/*1-*/ //this
//scene.remove(INTERSECTED);
/*2-*/ //or this
for ( c = 0, cl = INTERSECTED.children.length; c < cl; c ++ ) {
var child = INTERSECTED.children[ c ];
alert(child.id);
//child.parent.remove(obj);
INTERSECTED.remove(child);
//var lin = scene.children[child.id+1];
//r lin = scene.getObjectById(child.id+1, true );
// alert(child.id+1);
// INTERSECTED.remove(scene.children[child.id+1]);
}
//scene.remove(INTERSECTED);
scene.add(INTERSECTED);
animate();
}
}