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.

Die Werte werden durch Leerzeichen und/oder ein Komma getrennt. Die Anzahl der Einträge in der Liste muss gleich <orderX> mal <orderY> sein, 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"
    style="filter:url(#convolveMatrix1);" />
  <image
    href="mdn_logo_only_color.png"
    width="200"
    height="200"
    style="filter:url(#convolveMatrix2); transform:translateX(220px);" />
</svg>

Verwendungshinweise

Wert <Liste von Zahlen>
Standardwert Keiner
Animierbar Ja
<Liste von Zahlen>

Die Liste der <number>s, 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 gleich der Anzahl der Einträge in der Werteliste ist, wirkt das Filter-Primitive als Durchlauf-Filter.

Spezifikationen

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

Browser-Kompatibilität

BCD tables only load in the browser