代码之家  ›  专栏  ›  技术社区  ›  shinzou

如何应用三个。js着色器到节点

  •  0
  • shinzou  · 技术社区  · 7 年前

    我正在尝试应用来自 shaderLib 但它们中的大多数要么将节点完全变为白色,要么变为黑色。只有 normal 着色器似乎可以工作。

    我是这样应用的:

    const shader = THREE.ShaderLib.depth;
    const uniforms = shader.uniforms;
    const material = new THREE.ShaderMaterial({
      fragmentShader: shader.fragmentShader,
      vertexShader: shader.vertexShader,
      uniforms
    })
    
    this._viewer.impl.matman().addMaterial(
      data.name, material, true)
    

    function setMaterial(fragIds, material) {
    
        const fragList = this._viewer.model.getFragmentList()
    
        this.toArray(fragIds).forEach((fragId) => {
    
          fragList.setMaterial(fragId, material)
        })
    
        this._viewer.impl.invalidate(true)
      }
    

    就像在这个例子中: https://forge.autodesk.com/blog/forge-viewer-custom-shaders-part-1

    我也试着像那个例子一样给制服添加颜色,但没用。

    知道它们为什么不起作用吗?

    1 回复  |  直到 7 年前
        1
  •  0
  •   Eason Kang    7 年前

    three.js WebGLRender 没有实现所有功能 任何一个因此,它可能不支持 三js公司 .

    为了确定这个案例发生了什么,您可以考虑提供一个可复制的案例来证明这一点,我很乐意将其传递给我们的开发团队。以下项目应在可复制的情况下:

    1. 用于运行测试的完整但最小的样本源模型。
    2. 一个完整但最小的 Forge app
    3. 一个完整但最小的 three.js app 可以运行并演示所需的着色器效果。 笔记Forge Viewer正在使用r71 .
    4. 再现问题的详细分步说明,例如选择哪个元素、启动什么命令等。

    forge.help@autodesk.com remove sensitive data or information before you send

    =======旧响应

    您能提供更多详细信息以供进一步调试吗?

    https://forge-rcdb.autodesk.io/database?id=57efaf0377c8eb0a560ef467

    var shader = THREE.ShaderLib.depth;
    var uniforms = shader.uniforms;
    var material = new THREE.ShaderMaterial({
      fragmentShader: shader.fragmentShader,
      vertexShader: shader.vertexShader,
      uniforms
    })
    
    NOP_VIEWER.impl.matman().addMaterial( 'ShaderLabDepth', material, true );
    
    var sel = NOP_VIEWER.getSelection();
    
    var fragList = NOP_VIEWER.model.getFragmentList();
    var it = NOP_VIEWER.model.getData().instanceTree;
    it.enumNodeFragments( sel[0], function( fragId ) {
      fragList.setMaterial( fragId, material )
    });
    
    NOP_VIEWER.impl.invalidate( true );
    

    结果是这样的。这是你想要的吗? enter image description here