<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.

Das <feImage> SVG Filter-Primitive ruft Bilddaten aus einer externen Quelle ab und stellt die Pixeldaten als Ausgabe bereit (d. h., wenn die externe Quelle ein SVG-Bild ist, wird es gerastert.)

Verwendungskontext

KategorienPrimitives Filterelement
Erlaubter InhaltBeliebige Anzahl folgender Elemente, in beliebiger Reihenfolge:
<animate>, <animateTransform>, <set>

Attribute

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

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch