Three.js，我从r152更新到r153，为什么粒子更亮了？

Question

有什么办法可以在不降级的情况下恢复之前的效果吗？

更新到r153版本后，粒子效果不一样了，我在官方迁移指南中找不到这个问题的解决方案。

我的粒子代码：

    let total = 8000,
        minZVal = window.innerWidth * 0.5,
        minYVal = window.innerHeight * 1.2;

   for (let i = 0; i < total; i++) {
        const vertex = new Vector3();
        vertex.x = rangeRandom(minZVal, -minZVal);
        vertex.y = rangeRandom(minYVal, -minYVal);
        vertex.z = rangeRandom(minZVal, -minZVal);
        points.push(vertex)
        colors.push(255, 255, 255)
    }

    bufferGeometry.setFromPoints(points);
    bufferGeometry.setAttribute("color", new Float32BufferAttribute(colors, 3));

    const material = new PointsMaterial({
        size: 8,
        color: 0x01050f,
        alphaTest: 0.7,
        map: mapDot,
        vertexColors: true
    });
    group.add(new Points(bufferGeometry, material));

我的场景代码：

    const width = window.innerWidth, height = window.innerHeight
    ColorManagement.enabled = false
    bufferGeometry = new BufferGeometry();
    group = new Group();
    surroundParticleGroup = new Group();
    mapDot = new TextureLoader().load("./assets/gradient.png")
    camera = new PerspectiveCamera(75, width / height, 10, 10000);
    camera.position.z = 750;
    scene = new Scene();
    scene.fog = new FogExp2(0x02050c, 0.0025);
    scene.background = scene.fog.color
    scene.add(group);
    renderer = new WebGLRenderer({
        canvas: document.getElementById("canvas")
    });
    renderer.setPixelRatio(window.devicePixelRatio)
    renderer.setSize(width, height);
    renderer.setClearColor(scene.fog.color);
    renderer.autoClear = false
    renderer.render(scene, camera)
    controls = new OrbitControls(camera, renderer.domElement);

我尝试了这段代码，但它使粒子比以前更暗。

    material.color.convertSRGBToLinear()

Answer 1

您必须定义您的纹理包含 sRGB 颜色。这样做：

mapDot.colorSpace = THREE.SRGBColorSpace;

我尝试使用此代码，但它使粒子比以前更暗。

当您使用 CSS 和十六进制颜色定义颜色值时，

three.js

自动将它们识别为 sRGB 颜色，并将它们转换为

linear-srgb

工作色彩空间。所以在这种情况下不需要调用

convertSRGBToLinear()

。