WebGLRenderingContext: blendFuncSeparate()-Methode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die WebGLRenderingContext.blendFuncSeparate()-Methode der WebGL API definiert, welche Funktion für das Blenden von Pixel-Arithmetik für RGB- und Alphakomponenten separat verwendet wird.
Syntax
blendFuncSeparate(srcRGB, dstRGB, srcAlpha, dstAlpha)
Parameter
srcRGB-
Ein
GLenum, das einen Multiplikator für die roten, grünen und blauen (RGB) Quell-Mischfaktoren angibt. Der Standardwert istgl.ONE. Für mögliche Werte siehe unten. dstRGB-
Ein
GLenum, das einen Multiplikator für die roten, grünen und blauen (RGB) Ziel-Mischfaktoren angibt. Der Standardwert istgl.ZERO. Für mögliche Werte siehe unten. srcAlpha-
Ein
GLenum, das einen Multiplikator für den Alpha-Quell-Mischfaktor angibt. Der Standardwert istgl.ONE. Für mögliche Werte siehe unten. dstAlpha-
Ein
GLenum, das einen Multiplikator für den Alpha-Ziel-Mischfaktor angibt. Der Standardwert istgl.ZERO. Für mögliche Werte siehe unten.
Rückgabewert
Keiner (undefined).
Ausnahmen
- Wenn srcRGB, dstRGB, srcAlpha oder dstAlpha nicht einer der aufgeführten möglichen Werte ist, wird ein
gl.INVALID_ENUM-Fehler ausgelöst. - Wenn eine konstante Farbe und ein konstanter Alphawert zusammen als Quellen (
srcRGB) und Ziel (dstRGB) Faktoren verwendet werden, wird eingl.INVALID_ENUM-Fehler ausgelöst.
Konstanten
Die folgenden Konstanten können für srcRGB, dstRGB, srcAlpha und dstAlpha verwendet werden.
Die Formeln für die Mischfaktoren können wie folgt beschrieben werden (alle RGBA-Werte liegen zwischen 0 und 1):
- color(RGB) = (sourceColor * srcRGB) + (destinationColor * dstRGB)
- color(A) = (sourceAlpha * srcAlpha) + (destinationAlpha * dstAlpha)
In der folgenden Tabelle stehen RS, GS, BS, AS jeweils für die roten, grünen, blauen und alpha Komponenten der Quelle, während RD, GD, BD, AD jeweils für die roten, grünen, blauen und alpha Komponenten des Ziels stehen. Ebenso stehen RC, GC, BC, AC jeweils für die roten, grünen, blauen und alpha Komponenten einer konstanten Farbe. Sie sind alle Werte zwischen 0 und 1, inklusive.
| Konstante | RGB Faktor | Alpha Faktor | Beschreibung |
|---|---|---|---|
gl.ZERO |
0,0,0 | 0 | Multipliziert alle Farben mit 0. |
gl.ONE |
1,1,1,1 | 1 | Multipliziert alle Farben mit 1. |
gl.SRC_COLOR |
RS, GS, BS | AS | Multipliziert alle Farben mit den Quellfarben. |
gl.ONE_MINUS_SRC_COLOR |
1-RS, 1-GS, 1-BS | 1-AS | Multipliziert alle Farben mit 1 minus jeder Quellfarbe. |
gl.DST_COLOR |
RD, GD, BD | AD | Multipliziert alle Farben mit der Zielfarbe. |
gl.ONE_MINUS_DST_COLOR |
1-RD, 1-GD, 1-BD | 1-AD | Multipliziert alle Farben mit 1 minus jeder Zielfarbe. |
gl.SRC_ALPHA |
AS, AS, AS | AS | Multipliziert alle Farben mit der Quellalpha-Farbe. |
gl.ONE_MINUS_SRC_ALPHA |
1-AS, 1-AS, 1-AS | 1-AS | Multipliziert alle Farben mit 1 minus der Quellalpha-Farbe. |
gl.DST_ALPHA |
AD, AD, AD | AD | Multipliziert alle Farben mit der Zielalpha-Farbe. |
gl.ONE_MINUS_DST_ALPHA |
1-AD, 1-AD, 1-AD | 1-AD | Multipliziert alle Farben mit 1 minus der Zielalpha-Farbe. |
gl.CONSTANT_COLOR |
RC, GC, BC | AC | Multipliziert alle Farben mit einer konstanten Farbe. |
gl.ONE_MINUS_CONSTANT_COLOR |
1-RC, 1-GC, 1-BC | 1-AC | Multipliziert alle Farben mit 1 minus einer konstanten Farbe. |
gl.CONSTANT_ALPHA |
AC, AC, AC | AC | Multipliziert alle Farben mit einem konstanten Alphawert. |
gl.ONE_MINUS_CONSTANT_ALPHA |
1-AC, 1-AC, 1-AC | 1-AC | Multipliziert alle Farben mit 1 minus einem konstanten Alphawert. |
gl.SRC_ALPHA_SATURATE |
min(AS, 1 - AD), min(AS, 1 - AD), min(AS, 1 - AD) | 1 | Multipliziert die RGB-Farben mit dem kleineren Wert entweder der Quellalpha-Farbe oder dem Wert von 1 minus der Zielalpha-Farbe. Der Alphawert wird mit 1 multipliziert. |
Beispiele
Um die Mischfunktion zu verwenden, müssen Sie zuerst die Mischung mit WebGLRenderingContext.enable() mit dem Argument gl.BLEND aktivieren.
gl.enable(gl.BLEND);
gl.blendFuncSeparate(gl.SRC_COLOR, gl.DST_COLOR, gl.ONE, gl.ZERO);
Um die aktuelle Mischfunktion abzufragen, verwenden Sie die Konstanten BLEND_SRC_RGB, BLEND_SRC_ALPHA, BLEND_DST_RGB und BLEND_DST_ALPHA, die eine der Mischfunktionskonstanten zurückgeben.
gl.enable(gl.BLEND);
gl.blendFuncSeparate(gl.SRC_COLOR, gl.DST_COLOR, gl.ONE, gl.ZERO);
gl.getParameter(gl.BLEND_SRC_RGB) === gl.SRC_COLOR;
// true
Spezifikationen
| Specification |
|---|
| WebGL Specification # 5.14.3 |
Browser-Kompatibilität
BCD tables only load in the browser