Wie wird die Opazität mathematisch berechnet?
Es gibt einen Opazitätswert in Photoshop, CSS usw. Eigentlich ist diese Deckkraft das Transparenzverhalten einer Ebene. Das wissen wir alle. Aber wie wird es mathematisch berechnet? Gibt es eine Gleichung zur Berechnung der Deckkraft?
Indem Sie den Opazitätswert einstellen, was dort passiert?
Nehmen Sie den Fall von einfachen Farbschichten: Schicht 1 (Vordergrundebene) und Ebene 2 (Hintergrundebene)
Layer 1 ist rot (sagen wir Farbwert A
) und Layer 2 ist weiß (zB Farbwert B
).
Wenn wir die Deckkraft (zB p
) auf Ebene 1 setzen, können wir 0,5 oder 50% setzen und eine weißliche rote Farbe erhalten (zB Farbwert X
).
Um diesen Wert X
zu erhalten, was soll ich mathematisch tun?
ie.
%Vor% Ich möchte die genaue mathematische Gleichung kennen, um X
zu finden.
Auch wenn ich die Gleichung habe und Farbwerte hexadezimal sind, kann ich mit einem Hex-Rechner ein korrektes Ergebnis erhalten?
Die Formel zum Kombinieren von C1 = (R1,G1,B1)
und C2 = (R2,G2,B2)
in eine neue Farbe C3 , wobei C2 wird über C1 mit der Opazität p überlagert. p ist normalerweise ( (1-p)R1 + p*R2, (1-p)*G1 + p*G2, (1-p)*B1 + p*B2 )
.
Siehe Wikipedia-Artikel zu Transparenz für weitere Informationen.
Das folgende Javascript gibt eine Methode, die verwendet werden kann, um den Opazitätsfarbwert manuell zu berechnen:
%Vor%Code:
%Vor%Formel für Ergebnis des Mischens zweier transparenter Pixel:
C1 = [R1, G1, B1] ist die Vordergrundpixelfarbe.
C2 = [R2, G2, B2] ist die Hintergrundpixelfarbe.
p1 ist der Deckkraftanteil des Vordergrundpixels.
p2 ist der Deckkraftanteil des Hintergrundpixels.
Neue_Pixelfarbe = (p1 · c1 + p2 · c2 - p1 · p2 · c2) / (p1 + p2 - p1 · p2)
Neue_Pixel_opazität = p1 + p2-p1 * p2
Sie können es testen und genießen!
Tags und Links colors equation opacity mathematical-expressions