xChannelSelector

Baseline

Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Januar 2020 browserübergreifend verfügbar.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Das Attribut xChannelSelector gibt an, welcher Farbkanal aus in2 verwendet wird, um die Pixel in in entlang der x-Achse zu verschieben.

Elemente

Sie können dieses Attribut mit dem SVG-Element <feDisplacementMap> verwenden.

Beispiele

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 440 160" xmlns="http://www.w3.org/2000/svg">
  <filter id="displacementFilter">
    <feImage
      href="mdn.svg"
      x="0"
      y="0"
      width="100%"
      height="100%"
      result="abc" />
    <feDisplacementMap
      in2="abc"
      in="SourceGraphic"
      scale="30"
      xChannelSelector="R" />
  </filter>
  <filter id="displacementFilter2">
    <feImage
      href="mdn.svg"
      x="0"
      y="0"
      width="100%"
      height="100%"
      result="abc" />
    <feDisplacementMap
      in2="abc"
      in="SourceGraphic"
      scale="30"
      xChannelSelector="B" />
  </filter>

  <text x="10" y="60" font-size="50" filter="url(#displacementFilter)">
    Some displaced text
  </text>
  <text x="10" y="120" font-size="50" filter="url(#displacementFilter2)">
    Some displaced text
  </text>
</svg>

Hinweise zur Verwendung

Wert	`R` \| `G` \| `B` \| `A`
Standardwert	`A`
Animierbar	Ja

R: Dieses Schlüsselwort legt fest, dass der rote Farbkanal des durch in2 definierten Eingabebilds verwendet wird, um die Pixel des durch in definierten Eingabebilds entlang der x-Achse zu verschieben.
G: Dieses Schlüsselwort legt fest, dass der grüne Farbkanal des durch in2 definierten Eingabebilds verwendet wird, um die Pixel des durch in definierten Eingabebilds entlang der x-Achse zu verschieben.
B: Dieses Schlüsselwort legt fest, dass der blaue Farbkanal des durch in2 definierten Eingabebilds verwendet wird, um die Pixel des durch in definierten Eingabebilds entlang der x-Achse zu verschieben.
A: Dieses Schlüsselwort legt fest, dass der Alphakanal des durch in2 definierten Eingabebilds verwendet wird, um die Pixel des durch in definierten Eingabebilds entlang der x-Achse zu verschieben.

Spezifikationen

Spezifikation
Filter Effects Module Level 1 # element-attrdef-fedisplacementmap-xchannelselector

Browser-Kompatibilität

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden