order

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 order-Attribut gibt die Größe der Matrix an, die von einem <feConvolveMatrix>-Element verwendet werden soll.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
  <filter id="emboss1" x="0" y="0" width="100%" height="100%">
    <feTurbulence baseFrequency="0.025" seed="0" />
    <feConvolveMatrix kernelMatrix="3 0 0 -4" order="2" />
  </filter>
  <filter id="emboss2" x="0" y="0" width="100%" height="100%">
    <feTurbulence baseFrequency="0.025" seed="0" />
    <feConvolveMatrix kernelMatrix="3 0 0 0 0 0 0 0 -4" order="3" />
  </filter>

  <rect x="0" y="0" width="200" height="200" style="filter:url(#emboss1);" />
  <rect
    x="0"
    y="0"
    width="200"
    height="200"
    style="filter:url(#emboss2); transform: translateX(220px);" />
</svg>

Hinweise zur Verwendung

Wert <number-optional-number>
Standardwert 3
Animierbar Ja
<number-optional-number>

Dieser Wert gibt die Anzahl der Zellen in jeder Dimension für die Kernelmatrix an. Die angegebenen Werte müssen <integer>s größer als null sein. Werte, die keine Ganzzahlen sind, werden abgeschnitten, d.h. auf den nächstgelegenen ganzzahligen Wert in Richtung null gerundet. Die erste Zahl gibt die Anzahl der Spalten in der Matrix an. Die zweite Zahl gibt die Anzahl der Zeilen in der Matrix an. Falls keine zweite Zahl angegeben wird, wird der Wert der ersten Zahl übernommen.

Es wird empfohlen, nur kleine Werte (z.B. 3) zu verwenden; höhere Werte können zu einer sehr hohen CPU-Auslastung führen und produzieren normalerweise keine Ergebnisse, die die Auswirkungen auf die Leistung rechtfertigen.

Spezifikationen

Specification
Filter Effects Module Level 1
# element-attrdef-order

Browser-Kompatibilität