如何使用 Three.js 版本 54 隐藏/显示对象？答案

【问题标题】：How to Hide/Show Objects using Three.js release 54?如何使用 Three.js 版本 54 隐藏/显示对象？
【发布时间】：2016-09-23 15:15:57
【问题描述】：

我已将这个问题作为 Huge question 的一部分提出，但建议部分提出。这是我上一个问题的一部分。我之前的问题是：Here

我一直在使用 Three.js Release 50，并且能够在以下工具的帮助下显示/隐藏对象（在我的应用程序中，它是一个网格子对象）：

THREE.SceneUtils.traverseHierarchy(mesh,function(child){
var z = document.getElementById("cameras").selectedIndex*5 -10;
if (z === -10){
    child.visible = true;
} else if (child.position.z !== z){
    child.visible = false;
} else {

    child.visible = true;
};
});

但是在使用release 54的时候，据说要使用，object.traverse却发现很难一样。如何使用版本 54 替换上述代码？我在使用第 54 版时遇到的错误是：

请帮我解决这个问题。

【问题讨论】：

标签： three.js

【解决方案1】：

您发送给“traverseHierarchy”函数的“网格”变量是 Object3d 吗？如果是这样，您是否尝试过应该返回子对象数组的“mesh.children”，或者您可以在网格对象上使用 traverse 函数。

见：http://mrdoob.github.com/three.js/docs/54/#Reference/Core/Object3D

mesh.traverse(function(child) {
    var z = document.getElementById("cameras").selectedIndex * 5 - 10;
    if (z === -10) {
        child.visible = true;
    } else if (child.position.z !== z) {
        child.visible = false;
    } else {
        child.visible = true;
    };
});

【讨论】：

感谢您的回复，Mesh 是 Three's Mesh 几何体，我可以使用版本 50 成功运行，但使用版本 54，它显示上述错误。
我认为 Mesh 是 Object3d 的子类，所以上述内容仍然适用。您发布的错误确切地告诉您您的问题是什么，SceneUtils 不再有一个名为 traverseHierachy 的函数。
我已经根据您的解决方案编辑了我的 Jsfiddle，Jsfiddle 链接：jsfiddle.net/sagh0900/SQyLL/1 但看不到任何输出差异。我添加了 Three.min.js 版本 54 作为外部源。能否请您查看我的链接。

【解决方案2】：

深入挖掘，你会找到答案。

object.traverseHierarchy() 被重命名为 object.traverse()

$ grep -A10 'traverse: function' build/three.js
    traverse: function ( callback ) {

            callback( this );

            for ( var i = 0, l = this.children.length; i < l; i ++ ) {

                    this.children[ i ].traverse( callback );

            }

    },

【讨论】：

感谢您的回复，我真的对您的更高级别的答案感到困惑。能否请您分享一些工作示例。
它旨在鼓励您继续搜索代码。很抱歉混淆了。对 traverseHierarchy 的提交消息进行快速文本搜索，发现它已重命名为 traverse。 2pha 明白了。

【解决方案3】：

只需使用对象遍历的方法在three.js中隐藏网格。在我的代码中根据对象的名称隐藏对象

object.traverse ( function (child) {
    if (child instanceof THREE.Mesh) {  
        if (child.name.includes("3F")) {
            child.visible = true;
        } else {
            child.visible = false;
        }
    }
});

【讨论】：