<feImage>

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.

* Some parts of this feature may have varying levels of support.

Der <feImage> SVG-Filterprimitive ruft Bilddaten aus einer externen Quelle ab und gibt die Pixeldaten als Ausgabe zurück (was bedeutet, dass, wenn die externe Quelle ein SVG-Bild ist, es rasterisiert wird).

Verwendungskontext

Kategorien	Primitives Filterelement
Erlaubter Inhalt	Beliebige Anzahl folgender Elemente, in beliebiger Reihenfolge: `<animate>`, `<animateTransform>`, `<discard>`, `<set>`

Attribute

crossorigin
fetchpriority
- : Gibt einen Hinweis auf die relative Priorität beim Abrufen eines externen Bildes. Erlaubte Werte:
  
  high
  
  Abrufen des externen Bildes mit hoher Priorität relativ zu anderen externen Ressourcen.
  
  low
  
  Abrufen des externen Bildes mit niedriger Priorität relativ zu anderen externen Ressourcen.
  
  auto
  
  Setzt keine Präferenz für die Abrufpriorität. Es wird verwendet, wenn kein Wert oder ein ungültiger Wert gesetzt ist. Dies ist der Standard.
preserveAspectRatio
xlink:href Veraltet

DOM-Schnittstelle

Dieses Element implementiert die SVGFEImageElement-Schnittstelle.

Beispiel

SVG

html

<svg
  viewBox="0 0 200 200"
  xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink"
  width="200"
  height="200">
  <defs>
    <filter id="image">
      <feImage href="mdn_logo_only_color.png" />
    </filter>
  </defs>

  <rect x="10%" y="10%" width="80%" height="80%" style="filter:url(#image);" />
</svg>

Ergebnis

Spezifikationen

Specification
Filter Effects Module Level 1 # feImageElement