New Pages: SVGFEConvolveMatrixElement props

files/en-us/web/api/svgfeconvolvematrixelement/bias/index.md

@@ -0,0 +1,60 @@
+---
+title: "SVGFEConvolveMatrixElement: bias property"
+short-title: bias
+slug: Web/API/SVGFEConvolveMatrixElement/bias
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.bias
+---
+
+{{APIRef("SVG")}}
+
+The **`bias`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("bias")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+## Value
+
+An {{domxref("SVGAnimatedNumber")}} object.
+
+## Examples
+
+### Access the `bias` property
+
+The `bias` property is used to adjust the brightness of the output.
+
+```html
+<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <filter id="convolveFilterWithBias">
+      <feConvolveMatrix
+        in="SourceGraphic"
+        order="3"
+        kernelMatrix="0 -1 0 -1 5 -1 0 -1 0"
+        bias="0.25" />
+    </filter>
+  </defs>
+  <rect
+    x="20"
+    y="20"
+    width="100"
+    height="100"
+    style="fill:lightblue;"
+    filter="url(#convolveFilterWithBias)" />
+</svg>
+```
+
+```js
+const convolveMatrix = document.querySelector("feConvolveMatrix");
+
+console.log(convolveMatrix.bias.baseVal); // Output: 0.25
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedNumber")}}

files/en-us/web/api/svgfeconvolvematrixelement/divisor/index.md

@@ -0,0 +1,60 @@
+---
+title: "SVGFEConvolveMatrixElement: divisor property"
+short-title: divisor
+slug: Web/API/SVGFEConvolveMatrixElement/divisor
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.divisor
+---
+
+{{APIRef("SVG")}}
+
+The **`divisor`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("divisor")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+## Value
+
+An {{domxref("SVGAnimatedNumber")}} object.
+
+## Examples
+
+### Access the `divisor` property
+
+A convolution filter is applied to a rectangle, and the `divisor` is used to control the brightness.
+
+```html
+<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <filter id="convolveFilterWithDivisor">
+      <feConvolveMatrix
+        in="SourceGraphic"
+        order="3"
+        kernelMatrix="0 -1 0 -1 4 -1 0 -1 0"
+        divisor="1" />
+    </filter>
+  </defs>
+  <rect
+    x="20"
+    y="20"
+    width="100"
+    height="100"
+    style="fill:lightgreen;"
+    filter="url(#convolveFilterWithDivisor)" />
+</svg>
+```
+
+```js
+const convolveMatrix = document.querySelector("feConvolveMatrix");
+
+console.log(convolveMatrix.divisor.baseVal); // Output: 1
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedNumber")}}

files/en-us/web/api/svgfeconvolvematrixelement/edgemode/index.md

@@ -0,0 +1,44 @@
+---
+title: "SVGFEConvolveMatrixElement: edgeMode property"
+short-title: edgeMode
+slug: Web/API/SVGFEConvolveMatrixElement/edgeMode
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.edgeMode
+---
+
+{{APIRef("SVG")}}
+
+The **`edgeMode`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("edgeMode")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element. The `SVG_EDGEMODE_*` constants defined on this interface are represented by the numbers 1 through 3, where the default `duplicate` is `1`, `wrap` is `2`, and `none` is `3`.
+
+## Value
+
+An {{domxref("SVGAnimatedEnumeration")}} object.
+
+## Examples
+
+In this example, we retrieve the `<feConvolveMatrix>` filter element's `edgeMode` attribute value using the `edgeMode` property of the `SVGFEConvolveMatrixElement` interface.
+
+If our SVG contains the following filter:
+
+```html
+<feConvolveMatrix kernelMatrix="3 0 0 0 0 0 0 0 -4" id="el" edgeMode="wrap" />
+```
+
+We can access the number associated with the enumerated keyword value of the `edgeMode` attribute of the `feConvolveMatrix` element.
+
+```js
+const el = document.getElementById("el");
+console.log(el.edgeMode.baseVal); // output: 2
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedEnumeration")}}

files/en-us/web/api/svgfeconvolvematrixelement/in1/index.md

@@ -0,0 +1,59 @@
+---
+title: "SVGFEConvolveMatrixElement: in1 property"
+short-title: in1
+slug: Web/API/SVGFEConvolveMatrixElement/in1
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.in1
+---
+
+{{APIRef("SVG")}}
+
+The **`in1`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("in")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+## Value
+
+An {{domxref("SVGAnimatedString")}} object.
+
+## Examples
+
+In this example, the `<feConvolveMatrix>` element applies a convolution filter to an input graphic specified by the `in` attribute.
+
+```html
+<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <filter id="convolveFilter">
+      <feConvolveMatrix
+        in="SourceGraphic"
+        order="3"
+        kernelMatrix="0 -1 0 -1 4 -1 0 -1 0" />
+    </filter>
+  </defs>
+  <rect
+    x="20"
+    y="20"
+    width="100"
+    height="100"
+    style="fill:lightblue;"
+    filter="url(#convolveFilter)" />
+</svg>
+```
+
+We can access the `in` attribute of the `<feConvolveMatrix>` element.
+
+```js
+const convolveMatrix = document.querySelector("feConvolveMatrix");
+
+console.log(convolveMatrix.in1.baseVal); // Output: "SourceGraphic"
+```
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedString")}}

files/en-us/web/api/svgfeconvolvematrixelement/kernelmatrix/index.md

@@ -0,0 +1,27 @@
+---
+title: "SVGFEConvolveMatrixElement: kernelMatrix property"
+short-title: kernelMatrix
+slug: Web/API/SVGFEConvolveMatrixElement/kernelMatrix
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.kernelMatrix
+---
+
+{{APIRef("SVG")}}
+
+The **`kernelMatrix`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("kernelMatrix")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+## Value
+
+An {{domxref("SVGAnimatedNumberList")}} object.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedNumberList")}}

files/en-us/web/api/svgfeconvolvematrixelement/kernelunitlengthx/index.md

@@ -0,0 +1,29 @@
+---
+title: "SVGFEConvolveMatrixElement: kernelUnitLengthX property"
+short-title: kernelUnitLengthX
+slug: Web/API/SVGFEConvolveMatrixElement/kernelUnitLengthX
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.kernelUnitLengthX
+---
+
+{{APIRef("SVG")}}
+
+The **`kernelUnitLengthX`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("kernelUnitLength")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+It specifies the length in user units for each cell of the convolution matrix along the X-axis.
+
+## Value
+
+An {{domxref("SVGAnimatedNumber")}} object.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedNumber")}}

files/en-us/web/api/svgfeconvolvematrixelement/kernelunitlengthy/index.md

@@ -0,0 +1,29 @@
+---
+title: "SVGFEConvolveMatrixElement: kernelUnitLengthY property"
+short-title: kernelUnitLengthY
+slug: Web/API/SVGFEConvolveMatrixElement/kernelUnitLengthY
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.kernelUnitLengthY
+---
+
+{{APIRef("SVG")}}
+
+The **`kernelUnitLengthY`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("kernelUnitLength")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+It specifies the length in user units for each cell of the convolution matrix along the Y-axis.
+
+## Value
+
+An {{domxref("SVGAnimatedNumber")}} object.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedNumber")}}

files/en-us/web/api/svgfeconvolvematrixelement/orderx/index.md

@@ -0,0 +1,29 @@
+---
+title: "SVGFEConvolveMatrixElement: orderX property"
+short-title: orderX
+slug: Web/API/SVGFEConvolveMatrixElement/orderX
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.orderX
+---
+
+{{APIRef("SVG")}}
+
+The **`orderX`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("order")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+It specifies how many cells (or elements) are present in each row of the kernel matrix along the X-axis.
+
+## Value
+
+An {{domxref("SVGAnimatedInteger")}} object.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedInteger")}}

files/en-us/web/api/svgfeconvolvematrixelement/ordery/index.md

@@ -0,0 +1,29 @@
+---
+title: "SVGFEConvolveMatrixElement: orderY property"
+short-title: orderY
+slug: Web/API/SVGFEConvolveMatrixElement/orderY
+page-type: web-api-instance-property
+browser-compat: api.SVGFEConvolveMatrixElement.orderY
+---
+
+{{APIRef("SVG")}}
+
+The **`orderY`** read-only property of the {{domxref("SVGFEConvolveMatrixElement")}} interface reflects the {{SVGAttr("order")}} attribute of the given {{SVGElement("feConvolveMatrix")}} element.
+
+It specifies how many cells (or elements) are present in each row of the kernel matrix along the Y-axis.
+
+## Value
+
+An {{domxref("SVGAnimatedInteger")}} object.
+
+## Specifications
+
+{{Specifications}}
+
+## Browser compatibility
+
+{{Compat}}
+
+## See also
+
+- {{domxref("SVGAnimatedInteger")}}