GSAP 修改 GLTF 模型的材质颜色，但对 RGB 进行归一化，导致颜色不好

Question

我在R3F上工作，我用“0x292929”设置材质颜色，颜色很棒！如我所愿！

if (modelModifier.color !== undefined) {
  gsap.to(material.color, {
    r: ((modelModifier.color >> 16) & 255) / 255,
    g: ((modelModifier.color >> 8) & 255) / 255,
    b: (modelModifier.color & 255) / 255,
    duration: 1,
    immediateRender: false
  })
} else {
  material.color.setHex(0x292929)
}

但是现在如果我用

改变颜色

modelModifier.color: 0xf64941,

颜色不是红色，而是非常非常浅的白色/红色。所以我改回

modelModifier.color: 0x292929,

颜色材质不是深色，而是现在非常非常浅的白色/灰色。

我认为这是因为我当然在base/255上标准化了RGB，所以现在在标准化RGB上是292929：0.16，0.16，0.16 ...嗯，我做错了什么？如果没有我想要的好颜色，我就无法标准化 RGB？ （因为 RGB 中的十六进制 292929 通常是 41, 41, 41 ）

谢谢大家的帮助！

我尝试设置从十六进制到十六进制的过渡颜色的动画，但 GSAP 根本不喜欢这样，或者有一些糟糕的技巧。所以我需要标准化 RGB 或者简单 RGB ？

Answer 1

您上面没有提到颜色空间，但我认为 - 不是 0-1 或 0-255 标准化 - 可能是问题所在。在 Three.js 中，只有十六进制和 CSS 字符串输入被假定为 sRGB。除非另有说明，否则其他颜色输入假定位于工作颜色空间（线性 sRGB）中。

假设 GSAP 的十六进制输入是 sRGB，则输出将为 sRGB，并且您需要告诉 Three.js 您提供的 RGB 分量是 sRGB，例如：

material.color.setRGB(r, g, b, THREE.SRGBColorSpace);

也许应该在 GSAP

onUpdate

回调中完成。

三.js r152+