SVG/Tutorials/Filter/feComponentTransfer

Der primitive Filter feComponentTransfer bewirkt Änderungen der Helligkeit, des Kontrastes und der Farbbalance durch eine Änderung der Farbwerte jedes einzelnen Pixels.

Dies wird in den Kindelementen

• feFuncR für den roten Farbkanal
• feFuncG für den grünen Farbkanal
• feFuncB für den blauen Farbkanal
• feFuncA für den Alphakanal

festgelegt.

Anwendung

Beispiel ansehen …

  <defs>
    <linearGradient id="MyGradient" gradientUnits="userSpaceOnUse"
            x1="100" y1="0" x2="600" y2="0">
      <stop offset="0" stop-color="#ff0000" />
      <stop offset=".33" stop-color="#00ff00" />
      <stop offset=".67" stop-color="#0000ff" />
      <stop offset="1" stop-color="#000000" />
    </linearGradient>
    <filter id="Identity" filterUnits="objectBoundingBox" 
            x="0%" y="0%" width="100%" height="100%">
      <feComponentTransfer>
        <feFuncR type="identity"/>
        <feFuncG type="identity"/>
        <feFuncB type="identity"/>
        <feFuncA type="identity"/>
      </feComponentTransfer>
    </filter>
    <filter id="Table" filterUnits="objectBoundingBox" 
            x="0%" y="0%" width="100%" height="100%">
      <feComponentTransfer>
        <feFuncR type="table" tableValues="0 0 1 1"/>
        <feFuncG type="table" tableValues="1 1 0 0"/>
        <feFuncB type="table" tableValues="0 1 1 0"/>
      </feComponentTransfer>
    </filter>
    <filter id="Linear" filterUnits="objectBoundingBox" 
            x="0%" y="0%" width="100%" height="100%">
      <feComponentTransfer>
        <feFuncR type="linear" slope=".5" intercept=".25"/>
        <feFuncG type="linear" slope=".5" intercept="0"/>
        <feFuncB type="linear" slope=".5" intercept=".5"/>
      </feComponentTransfer>
    </filter>
    <filter id="Gamma" filterUnits="objectBoundingBox" 
            x="0%" y="0%" width="100%" height="100%">
      <feComponentTransfer>
        <feFuncR type="gamma" amplitude="2" exponent="5" offset="0"/>
        <feFuncG type="gamma" amplitude="2" exponent="3" offset="0"/>
        <feFuncB type="gamma" amplitude="2" exponent="1" offset="0"/>
      </feComponentTransfer>
    </filter>
  </defs>

Diese Beispiel aus der Spezifikation zeigt die verschiedenen Transfertypen.

Folgende Attribute sind möglich:

• in: Eingangsgrafik

Kindelemente

feFuncR

Dieser primitive Filter legt die Transferfunktion für den roten Farbkanal der Eingangsgrafik des Elternelements fest.

feFuncG

Dieser primitive Filter legt die Transferfunktion für den grünen Farbkanal der Eingangsgrafik des Elternelements fest.

feFuncB

Dieser primitive Filter legt die Transferfunktion für den blauen Farbkanal der Eingangsgrafik des Elternelements fest.

feFuncA

Dieser primitive Filter legt die Transferfunktion für den Alphakanal der Eingangsgrafik des Elternelements fest.

Attribute

• type:
  • identity: die verarbeitete Komponente entspricht der ursprünglichen Komponente C' = C
  • table: Tabellenfunktion (lineare Interpolation), Werte werden mit tableValues bestimmt.
  • discrete: Treppenfunktion (step function), Werte werden mit tableValues bestimmt
  • linear: lineare Funktion (bes. für Helligkeit), Werte werden mit slope und intercept bestimmt.
  • gamma: Exponentialfunktion (bes. für Kontrasteinstellungen); Werte werden mit amplitude, exponent und offset bestimmt
• tableValues: Liste von Zahlen für type="table"
• slope: Transfer Funktionsattribut, das bei type ="linear" eine Kurve festlegt. (Standardwert ist 1)
• intercept: Transfer Funktionsattribut, das bei type ="linear" den intercept-Wert festlegt. (Standardwert ist 1)
• amplitude: Transfer Funktionsattribut, das bei type ="gamma" die Amplitude der Gamma-Funktion festlegt (Standardwert ist 1)
• exponent: Transfer Funktionsattribut, das bei type ="gamma" den Exponenten der Gamma-Funktion festlegt (Standardwert ist 1)
• offset: Transfer Funktionsattribut, das bei type ="gamma" die Verschiebung der Gamma-Funktion festlegt (Standardwert ist 0)

Quellen

• wikibooks.org: Urfilter feComponentTransfer

Referenz

• SVG/Element/feComponentTransfer