k1

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 k1 Attribut definiert einen der Werte, der innerhalb der arithmetic Operation des <feComposite> Filterprimitivs verwendet wird.

Die Pixelkomposition wird mit der folgenden Formel berechnet:

js
result = k1 * i1 * i2 + k2 * i1 + k3 * i2 + k4;

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="composite1" x="0" y="0" width="100%" height="100%">
    <feComposite
      in2="SourceGraphic"
      operator="arithmetic"
      k1="1"
      k2="0"
      k3="0"
      k4="0" />
  </filter>
  <filter id="composite2" x="0" y="0" width="100%" height="100%">
    <feComposite
      in2="SourceGraphic"
      operator="arithmetic"
      k1="10"
      k2="0"
      k3="0"
      k4="0" />
  </filter>

  <image
    href="mdn.svg"
    x="0"
    y="0"
    width="200"
    height="200"
    style="filter: url(#composite1);" />
  <image
    href="mdn.svg"
    x="0"
    y="0"
    width="200"
    height="200"
    style="filter: url(#composite2); transform: translateX(220px);" />
</svg>

Nutzungshinweise

Wert <number>
Standardwert 0
Animierbar Ja

Spezifikationen

Specification
Filter Effects Module Level 1
# element-attrdef-fecomposite-k1

Browser-Kompatibilität