Question

我的程序使用包含每个粒子的alpha值的自定义属性创建动态数量的点云对象。这种方法很好，但是，当对象彼此嵌套（比如球体）时，较小的（内部）被较大的对象遮挡，即使它们的粒子的alpha设置正确。当我颠倒将点云对象添加到场景的顺序时，从较大的对象开始，向下到较小的对象，我可以通过较大的对象看到较小的对象。我的问题是，是否有办法告诉渲染器更新或重新计算alpha值或重新渲染较小的内部对象，以便它们出现？

Answer 1

我遇到了和你一样的问题。我修复它来计算并设置每个网格的renderdepth。为此，您需要摄像机位置和网格中心。

您可能已经为每个对象创建了网格物体。如果将所有这些网格保存到数组中，则更容易计算并在这些对象上设置renderdepth。

以下是我如何做到的一个例子。

updateRenderDepthOnRooms(cameraPosition: THREE.Vector3): void {
    var rooms: Room[] = this.getAllRooms();

    rooms.forEach((room) => {
        var roomCenter = getCenter(room.mesh.geometry);  
        var renderDepth = 0 - roomCenter.distanceToSquared(cameraPosition);
        room.mesh.renderDepth = renderDepth;            
    });
}

function getCenter(geometry: THREE.Geometry): THREE.Vector3 {
    geometry.computeBoundingBox();

    var bb = geometry.boundingBox;
    var offset = new THREE.Vector3();

    offset.addVectors(bb.min, bb.max);
    offset.multiplyScalar(0.5);

    return offset;
}

因此，要获得对象的中心，可以从网格中询问几何体并使用我的示例中的getCenter（..）函数。然后使用ThreeJs函数distanceToSquared（..）计算renderdepth，然后将此renderdepth设置为网格。

那就是它。希望这会对你有所帮助。

ThreeJS - 以不同顺序添加对象会影响alpha / display

1 个答案: