BlendFunction

BlendFunction 定义了用于混合颜色的混合函数。

在 Cesium 中，当多个图层重叠时，可能需要使用混合函数来计算最终颜色。BlendFunction 可以指定如何混合颜色。

创建 BlendFunction

可以通过传递以下值之一来创建 BlendFunction：

• BlendOption.OPAQUE：不使用混合函数，将仅使用地球表面上最上面的图层。
• BlendOption.TRANSLUCENT：使用透明混合 (SRC_ALPHA，ONE_MINUS_SRC_ALPHA)，使得底部图层透过上层图层。
• BlendOption.ADDITIVE：使用加法混合 (SRC_ALPHA，ONE)，使上层图层的颜色叠加到底层图层上。

import {BlendFunction, BlendOption} from 'cesium';

const opaqueBlend = BlendFunction.create(BlendOption.OPAQUE);
const translucentBlend = BlendFunction.create(BlendOption.TRANSLUCENT);
const additiveBlend = BlendFunction.create(BlendOption.ADDITIVE);

混合因子

可以通过调用 BlendFunction 的 getBlendEquation() 和 getBlendFunction() 方法，获取当前混合函数的混合因子。

混合因子由以下值之一组成：

• 加法因子：ZERO、ONE、SRC_COLOR、ONE_MINUS_SRC_COLOR、DST_COLOR、ONE_MINUS_DST_COLOR、SRC_ALPHA、ONE_MINUS_SRC_ALPHA、DST_ALPHA、ONE_MINUS_DST_ALPHA
• 混合方程式：FUNC_ADD、FUNC_SUBTRACT、FUNC_REVERSE_SUBTRACT

import {BlendFunction, BlendOption} from 'cesium';

const blend = BlendFunction.create(BlendOption.TRANSLUCENT);
const equation = blend.getBlendEquation();
const source = blend.getBlendFunction()[0];
const destination = blend.getBlendFunction()[1];

console.log(`Equation: ${equation}, Source: ${source}, Destination: ${destination}`);

替代函数

可以通过调用 BlendFunction 的 setOptions() 方法，传递混合因子的自定义值，替代默认的混合函数。

import {BlendFunction, BlendOption} from 'cesium';

const blend = BlendFunction.create(BlendOption.TRANSLUCENT);

// 使用自定义混合函数，使底部图层变暗
blend.setOptions({
    rgbBlendFunction: [
        Cesium.BlendFunction.SOURCE_ALPHA_SATURATE,
        Cesium.BlendFunction.ONE_MINUS_SOURCE_ALPHA
    ],
    alphaBlendFunction: [
        Cesium.BlendFunction.ZERO,
        Cesium.BlendFunction.ONE
    ],
});