three.js - threejs中，使用GUI控制纹理的颜色空间为什么不能生效？

Question

//创建纹理加载器let textureLoader = new THREE.TextureLoader()//加载纹理let texture = textureLoader.load('./textures/parvers/worn_patterned_pavers_diff_4k.jpg')// let texture = textureLoader.load('./textures/covers/Sewer-0793.jpg')//设置sRGB纹理的颜色空间texture.colorSpace = THREE.SRGBColorSpacegui.add(texture, 'colorSpace', {  sRGB: THREE.SRGBColorSpace,  Linear: THREE.LinearSRGBColorSpace}).onChange((val) => {  console.log('change',val)  console.log(texture)  console.log(texture.colorSpace)  texture.needsUpdate = true})

输出的内容显示，texture对象的colorSpace已经改变了，但是页面没有重新渲染。

即便在使用后，texture.needsUpdate = true 后，仍然没有效果。

值得注意的是，当我不设置texture的颜色空间，即texture.colorSpace = THREE.LinearSRBColorSpace 或者 THREE.NoColorSpace的时候，可以实现页面从linear-srgb到srgb的转换，但是不能实现srgb到linear-srgb的转换。

这是什么情况导致的？该如何实现GUI控制纹理的颜色空间的转变？

补充1：

根据官方文档，只要改变颜色空间，就需要将材质的needsUpdate设置为true就可以重新编译了，但是，即使我在onchange中的回调函数中加上material.needsUpdate = true也并没有什么改变

Answer 1

gui.add(params, 'colorSpace', {  sRGB: 'sRGB',  Linear: 'Linear'}).onChange((val) => {  texture.dispose(); // 释放旧纹理  texture = textureLoader.load('./textures/your_texture.jpg', function(t) {    if (val === 'sRGB') {      t.encoding = THREE.sRGBEncoding;    } else {      t.encoding = THREE.LinearEncoding;    }  });  material.map = texture; // 更新材质的纹理  material.needsUpdate = true; // 标记材质需要更新});