Three.js：更改网格颜色会导致只有 1 个面受到更改的影响答案

【问题标题】：Three.js: changing mesh color results in only 1 face getting affected by the changeThree.js：更改网格颜色会导致只有 1 个面受到更改的影响
【发布时间】：2021-09-27 20:26:11
【问题描述】：

所以我有一个 GLB 格式的模型（来自 CAD 的组件），其中包含许多部件、层次结构等。我想要完成的是在鼠标悬停时突出显示一个对象（特别是程序集的一部分）。

所以执行此操作的主要代码是：

raycaster.setFromCamera( pointer, camera );
            
                const intersects = raycaster.intersectObjects(scene.children, true);

                if ( intersects.length > 0 ) {

                    if ( INTERSECTED != intersects[ 0 ].object ) {

                        if ( INTERSECTED ) INTERSECTED.material.color.set( INTERSECTED.currentColor );

                        INTERSECTED = intersects[ 0 ].object;
                        
                        INTERSECTED.currentColor = INTERSECTED.material.color.getHex();

                        INTERSECTED.material = INTERSECTED.material.clone();
                        INTERSECTED.material.color.setHex( 0xffb300 );

                    }

                } else {

                    if ( INTERSECTED ) INTERSECTED.material.color.set( INTERSECTED.currentColor );
                    INTERSECTED = null;

                }

但不幸的是，我得到的结果是只有 1 个面发生了颜色变化，其余的网格没有。我已经尝试了很多东西，但我在 three.js 上是个新手，所以基本上我不知道

【问题讨论】：

你介意在这个帖子中分享 glTF 资源吗？
嘿，是的，就在这里。不完全是我将使用的模型，而是另一个表现出相同行为的模型easyupload.io/pcgo0y
如果使用来自webgl_interactive_cubes 的代码，我将无法重现。我刚刚从pointermove 切换到pointerdown。选择时，整个子网格都会突出显示。
看你的代码，我怀疑单面的颜色变了。这只有在模型的每个三角形都有自己的材料时才有可能。共享 glTF 模型绝对不是这种情况。
介意我分享我的整个代码吗？如果我发布的剪辑是正确的，我真的不知道还有什么问题...pastebin.com/ifvdGF4u

标签： javascript three.js gltf

【解决方案1】：

对于将来遇到同样问题的任何人：出于某种原因，step->glb 转换为每个对象面创建了一个独立的网格。因此，为了突出整个部分，我必须更改 object.parent.children 中每个对象的材质

【讨论】：