Three.js 启用混合时如何避免与背景混合

我正在尝试实现potree实现混合Splat的功能。在中，当禁用

EDL

并将

quality

选项切换到

Appearance

文件夹中的

Splats

时，会显示混合效果

我的问题是，它如何避免这些与背景混合的点。当我在自己的项目中启用混合时，这些点与我的背景颜色混合，看起来不太好。避免与背景混合的优雅解决方案是什么

编辑：

您可以看到这些点正在与白色背景混合。我正在使用自定义着色器设置alpha值。在此图像中，alpha值为0.5

---

Potree使用了一个更复杂的混合功能，需要3次传递

可见性过程：渲染深度

属性过程：进行加法混合，但仅适用于深度缓冲区后面最多混合第四个单位的点

着色/规格化过程：规格化添加剂输出，使其从明亮的添加剂变为平滑混合的外观

（编辑：摘自）

属性过程将属性值的加权和输出到rgb通道，将权重和输出到alpha通道。 每个点的权重w取决于到中心的距离。 片段着色器的输出是：

gl\u FragColor=vec4（w*rgb，w）

归一化过程是一个屏幕空间后处理着色器，它将帧缓冲区中的每种颜色按权重进行分割：

gl\u FragColor=vec4（加权SumofRbs/sumOfWeights，1.0）

最终结果是平滑混合点，过渡硬度取决于权重函数：

查看本论文以获得更详细的解释（第4.2.2章）：

或者这篇算法的原始论文：

编辑：

---

此外，为了避免看穿背景，请使用黑色和alpha=0清除缓冲区，然后使用高质量的三次飞溅算法渲染点，并在最后一步渲染背景。背景仅在没有渲染点的区域可见。

您能否给出一个图片示例，说明您在项目中看到了什么？另外，你的点是使用标准材质，还是有自定义着色器？因此你希望它们彼此混合，但不与背景混合？@TheJim01是的。我不希望这些点与背景混合。@rabbi76我在three.js中使用

NormalBlending

。更改背景alpha值没有任何意义。最后的颜色只与源alpha值有关，而与目标alpha值无关。我不确定这是否是问题的答案，但它肯定是一个很好的描述，即使它是剽窃。@rabbi76我试图回答关于如何在potree中实现它的问题，而不是一个有适当引用的科学应用程序。此外，我还链接到了图片的来源。我从未见过有人期望在回答中出现“从……拍摄的图像”。剽窃肯定不是我想要的，或者在图2和图3中是自我剽窃。@Markus我如何存储重量总和？在颜色缓冲区中，我只能存储0.0-1.0之间的值。@K.Miao您必须渲染到浮点纹理，该纹理未绑定到0到1的范围。这可能会有所帮助：这是初始化属性过程的渲染目标的地方：EDLRenderer也会做一些稍微不同的操作，以避免穿透背景。属性过程渲染到不同的帧缓冲区，EDL过程从该fbo读取，并在背景上将着色结果渲染到主fbo。