Three.js 默认情况下，为什么EffectsComposer会无意中使自定义着色器材质更亮？

在Three.js中，如果您添加一个空的EffectsComposer，您的着色器材质似乎会无意中变得更亮，看起来会被吹坏

---

似乎添加作曲家也可以实现颜色空间转换。要解决这些问题，您必须做几件事：

• 将纹理的

  encoding

  属性设置为

  sRGBEncoding

• 使用

  three.js

  函数

  mapTexelToLinear（）

  将texel转换为线性颜色空间
• 为保持一致性，请将

  #include

  着色器块添加到代码中（不必修复此问题，但如果不使用后期处理，但更改渲染器的输出编码，则这一点很重要）
• 将纹理指定给

  ShaderMaterial.map

  ，以便渲染器可以使用正确的代码配置

  mapTexelToLinear（）

import./styles.css'；
从“三”导入{TextureLoader、ShaderMaterial、sRGBEncoding}；
从“react”导入{useMemo}；
从'@react three/postprocessing'导入{EffectComposer}；
导出默认函数App（）{
const texture=new TextureLoader（）.load（'crater.gif'）；
texture.encoding=sRGBEncoding；
常量shaderMaterial=useMoom(
() =>
新材质({
碎片着色器：`
均匀取样器2D u_Txt1；
可变vec2 vUv；
void main（）{
gl_FragColor=mapTexelToLinear（纹理2d（u_Txt1，vUv））；
#包括
}`,
制服：{
u_Txt1:{value:texture}
},
顶点着色器：`#包括
可变vec2 vUv；
空干管（）{
vUv=紫外线；
gl_位置=projectionMatrix*modelViewMatrix*vec4（位置，1.0）；
}`
}),
[纹理]
);
shaderMaterial.map=纹理；
返回(
{/*  */}
);
}

谢谢@mugen87，这真是太棒了！太好了！请也接受这个答案。