在 ThreeJs 中向 material 动态添加新制服？

Question

是否可以在 ThreeJs 中动态地向标准 MeshMaterial 添加新的制服？

像这样：

material = new THREE.MeshPhongMaterial();
material.uniforms = {
  customTexture: new THREE.Texture(canvas),
  textureSize: { value: 1024 },
};

我已经修改了一些 THREE.ShaderChunks 所以它能够在着色器中使用新的制服，但是当 material 得到时 three.js 似乎忽略了新的制服编译...

Answer 1

Is it possible to add a new uniform to a standard MeshMaterial dynamically in ThreeJs?

是的。请看下面的例子：webgl_materials_modified

在此演示中，MeshNormalMaterial 通过额外的统一 time 和一些顶点转换逻辑得到增强。它使用 Material.onBeforeCompile() ，它在编译着色器程序之前立即执行。这是在 three.js.

中修改 built-in 材料的推荐方法

Dynamically add new uniform to a material in ThreeJs?