Javascript 我如何清除 THREE.JS 场景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30359830/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I clear THREE.JS Scene
提问by ExtremelySeriousChicken
I am trying to find ways of clearing all the objects in a scene without destroying the scene itself. I know that naming the object is one way and then when we want to delete the object, we just "get" it by its name. However, I want to find a quick way to clear a scene of all the objects in it, regardless of their names. Is there a easy way to do it? Thanks!
我试图找到清除场景中所有对象而不破坏场景本身的方法。我知道命名对象是一种方法，然后当我们想要删除该对象时，我们只需按其名称“获取”它。但是，我想找到一种快速方法来清除场景中的所有对象，而不管它们的名称如何。有没有简单的方法来做到这一点？谢谢！
回答by micnil
You can traverse the child objects of the scene and remove them one by one.
您可以遍历场景的子对象并一一移除它们。
scene.children.forEach(function(object){
scene.remove(object);
});
Edit:
编辑：
As suggested in the comments, the above answer is wrong. The correct way to remove all objects from the scene is using a for/while loop.
正如评论中所建议的，上述答案是错误的。从场景中移除所有对象的正确方法是使用 for/while 循环。
while(scene.children.length > 0){
scene.remove(scene.children[0]);
}
Note: This is just a quick and dirty clearing of the object hierarchy. If you plan on doing this a lot you risk running in to memory leaks with the code above because the renderer has references to the objects materials, textures and geometries. A complete clean of the scene is more complicated and there are plenty other questions that goes in to more detail:
注意：这只是对对象层次结构的快速清除。如果您计划大量执行此操作，则可能会因上述代码而导致内存泄漏，因为渲染器引用了对象材质、纹理和几何图形。完全清理场景更复杂，还有很多其他问题需要详细说明：
回答by u6045817
Traversing all children and call dispose on their geometry, material and texture. The code below is my solution.
遍历所有子元素并调用它们的几何、材质和纹理的 dispose。下面的代码是我的解决方案。
function clearThree(obj){
while(obj.children.length > 0){
clearThree(obj.children[0])
obj.remove(obj.children[0]);
}
if(obj.geometry) obj.geometry.dispose()
if(obj.material){
//in case of map, bumpMap, normalMap, envMap ...
Object.keys(obj.material).forEach(prop => {
if(!obj.material[prop])
return
if(typeof obj.material[prop].dispose === 'function')
obj.material[prop].dispose()
})
obj.material.dispose()
}
}
clearThree(scene)
回答by Jonathan Gray
I have a more concise way of doing this. I noticed that the removemethod of Object3D accepts more than one parameter for object removal. This allows us to use the entire childrenarray by modifying the call to use each element as individual parameters by taking advantage of the built-in applymethod for functions. This works like so:
我有一个更简洁的方法来做到这一点。我注意到removeObject3D的方法接受多个参数来移除对象。这允许我们children通过修改调用来使用整个数组，以利用apply函数的内置方法将每个元素用作单独的参数。这像这样工作：
scene.remove.apply(scene, scene.children);
