为特定元素设置透明

Question

我想为特定元素设置透明，我遵循以下代码：


        var instanceTree = this.viewer.model.getInstanceTree();
        var fragList = this.viewer.model.getFragmentList();
        this.listElement.forEach(element => {
            instanceTree.enumNodeFragments(element, (fragId) => {
                console.log(element.material)
                var material = fragList.getMaterial(fragId)
                if (material) {
                    material.opacity = value;
                    material.transparent = true;
                    material.needsUpdate = true;
                }
            });
        });
        this.viewer.impl.invalidate(true, true, true);

但它覆盖了所有具有 material 的元素。我如何设置选定的元素？感谢任何评论。

更新 1： 我发现 go around way 是 clone main material 而不是用不同的名称注册它：

                    var newMaterial = material.clone();
                    const materials = this.viewer.impl.matman();
                    materials.addMaterial('mymaterial',newMaterial,true);
                    fragList.setMaterial(fragId,newMaterial);
                    newMaterial.opacity = value;
                    newMaterial.transparent = true;
                    newMaterial.needsUpdate = true;

但效果不是我想要的，它有不同的颜色，当设置为透明时我只能看到它后面的几个物体

Answer 1

您可以创建自己的自定义 THREE.js material 并将其分配给使用 fragList.setMaterial(fragId, material) 的片段。

有关使用自定义 material 或着色器的更多信息，请参阅 https://forge.autodesk.com/blog/custom-shader-materials-forge-viewer。

编辑：

关于视觉异常（例如，当您只看到某些东西后面的某些物体时 semi-transparent），这是一个已知问题，不幸的是没有明确的解决方案。当 Forge Model Derivative 服务创建要在 Forge Viewer 中查看的 SVF 文件时，各个场景元素将存储在为快速遍历而优化的数据结构中，具体取决于它们是 semi-transparent 还是完全不透明。这个数据结构是固定的，所以不幸的是，当你把一个原本完全不透明的对象做成semi-transparent，它很可能会以错误的顺序呈现...

为特定元素设置透明

Set transparent for specific element

autodesk-forge

autodesk-viewer