SVG/Attribut/k1, k2, k3, k4

Die Attribute k1, k2, k3 und k4 sind Gewichtungsparameter, die bei Anwendung von operator="arithmetic" des feComposite-Filtereffekts festlegen, welches Teilbild sich wie stark auf das Ergebnis auswirkt. Bei Anwendung des arithmethic-Operators wird für jeden Farbwert jedes Bildpunkts die folgende Formel ausgewertet:

 ergebnis = k₁×i₁×i₂ + k₂×i₁ + k₃×i₂ + k₄

Hierbei bezeichen i₁ und i₂ einen Farbwert (Rot, Grün, Blau oder Transparenz) eines Bildpunkts und k₁ bis k₄ die Werte der k-Attribute. Die Werte von i₁ und i₂ liegen dabei im Bereich 0 bis 1. Das Ergebnis wird auf das Intervall [0, 1] begrenzt.

Erlaubte Werte

Zahl. Die Spezifikation legt den Wertebereich nicht fest, es gab aber Browser, die die Attribute auf das Intervall [0, 1] begrenzt haben. Werte größer als 1 sollten mittlerweile funktionieren, negative Werte hingegen nicht.

Standardwert

0

anwendbar auf

feComposite

Präsentationsattribut

nein

mit CSS animierbar

nein (nur mit SMIL)

Beispiel

  
<filter id="overFlood"
        filterUnits="objectBoundingBox"
        x="-5%" y="-5%" width="110%" height="110%">
      <feFlood flood-color="#ffffff"
               flood-opacity="1"
               result="flood"/>
      <feComposite in="SourceGraphic"
                   in2="BackgroundImage" 
                   operator="over"
                   result="comp"/>
      <feMerge> 
         <feMergeNode in="flood"/> 
         <feMergeNode in="comp"/>
      </feMerge>
</filter>
<filter id="inFlood" filterUnits="objectBoundingBox"
        x="-5%" y="-5%" width="110%" height="110%">
      <feFlood flood-color="#ffffff" 
               flood-opacity="1" result="flood"/>
      <feComposite in="SourceGraphic" 
                   in2="BackgroundImage"
                   operator="in" 
                   result="comp"/>
      <feMerge> 
         <feMergeNode in="flood"/> 
         <feMergeNode in="comp"/>
      </feMerge>
</filter>
<filter id="outFlood" filterUnits="objectBoundingBox"
         x="-5%" y="-5%" width="110%" height="110%">
  <feFlood flood-color="#ffffff" 
    flood-opacity="1" result="flood"/>
  <feComposite in="SourceGraphic" 
               in2="BackgroundImage" operator="out" result="comp"/>
  <feMerge>
    <feMergeNode in="flood"/> 
    <feMergeNode in="comp"/>
  </feMerge>
</filter>
<filter id="atopFlood" filterUnits="objectBoundingBox" 
         x="-5%" y="-5%" width="110%" height="110%">
  <feFlood flood-color="#ffffff" flood-opacity="1" result="flood"/>
  <feComposite in="SourceGraphic" 
               in2="BackgroundImage" operator="atop" result="comp"/>
  <feMerge> <feMergeNode in="flood"/> <feMergeNode in="comp"/> </feMerge>
</filter>
 <filter id="xorFlood" filterUnits="objectBoundingBox" 
   x="-5%" y="-5%" width="110%" height="110%">
  <feFlood flood-color="#ffffff" 
           flood-opacity="1" result="flood"/>
 <feComposite in="SourceGraphic"
              in2="BackgroundImage" operator="xor" result="comp"/>
  <feMerge> 
     <feMergeNode in="flood"/>
     <feMergeNode in="comp"/>
  </feMerge>
</filter>
<filter id="arithmeticFlood" filterUnits="objectBoundingBox" 
         x="-5%" y="-5%" width="110%" height="110%">
  <feFlood flood-color="#ffffff" flood-opacity="1" result="flood"/>
  <feComposite in="SourceGraphic" in2="BackgroundImage" result="comp"
                operator="arithmetic" k1=".5" k2=".5" k3=".5" k4=".5"/>
 <feMerge> <feMergeNode in="flood"/> <feMergeNode in="comp"/> </feMerge>
</filter>

Siehe auch

SVG/Element/feComposite

Weblinks

• Filter Effects Spezifikation (W3C): feComposite Effekt