kernelMatrix

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 kernelMatrix-Attribut definiert die Liste von Zahlen, die die Kernel-Matrix für das <feConvolveMatrix>-Element bilden.

Werte werden durch Leerzeichen und/oder ein Komma getrennt. Die Anzahl der Einträge in der Liste muss gleich <orderX> mal <orderY> entsprechen, wie im order-Attribut definiert.

Dieses Attribut kann mit den folgenden SVG-Elementen verwendet werden:

Beispiel

html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
  <filter id="convolveMatrix1" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix kernelMatrix="1 1 0 0 0 0 0 0 -1" />
  </filter>
  <filter id="convolveMatrix2" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix kernelMatrix="-1 0 0 0 0 0 0 0 1" />
  </filter>

  <image
    href="mdn_logo_only_color.png"
    width="200"
    height="200"
    filter="url(#convolveMatrix1)" />
  <image
    x="220"
    href="mdn_logo_only_color.png"
    width="200"
    height="200"
    filter="url(#convolveMatrix2)" />
</svg>

Verwendungshinweise

Wert <list of numbers>
Standardwert Keiner
Animierbar Ja
<list of numbers>

Die Liste von <number>n, die die Kernel-Matrix für die Faltung bilden. Werte werden durch Leerzeichen und/oder ein Komma getrennt. Die Anzahl der Einträge in der Liste muss <orderX> mal <orderY> entsprechen.

Wenn das Ergebnis von orderX * orderY nicht der Anzahl der Einträge in der Werteliste entspricht, wirkt der Filter-Primitive als Durchgangsfilter.

Spezifikationen

Specification
Filter Effects Module Level 1
# element-attrdef-feconvolvematrix-kernelmatrix

Browser-Kompatibilität