-
Notifications
You must be signed in to change notification settings - Fork 22.4k
/
index.md
75 lines (61 loc) · 2.61 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
---
title: edgeMode
slug: Web/SVG/Attribute/edgeMode
page-type: svg-attribute
spec-urls: https://drafts.fxtf.org/filter-effects/#element-attrdef-feconvolvematrix-edgemode
---
{{SVGRef}}
The **`edgeMode`** attribute determines how to extend the input image as necessary with color values so that the matrix operations can be applied when the kernel is positioned at or near the edge of the input image.
You can use this attribute with the following SVG elements:
- {{SVGElement("feConvolveMatrix")}}
- {{SVGElement("feGaussianBlur")}}
## feConvolveMatrix
For {{SVGElement("feConvolveMatrix")}}, `edgeMode` determines how to extend the input image as necessary with color values so that the matrix operations can be applied when the kernel is positioned at or near the edge of the input image.
<table class="properties">
<tbody>
<tr>
<th scope="row">Value</th>
<td><code>duplicate</code> | <code>wrap</code> | <code>none</code></td>
</tr>
<tr>
<th scope="row">Default value</th>
<td><code>duplicate</code></td>
</tr>
<tr>
<th scope="row">Animatable</th>
<td>Yes</td>
</tr>
</tbody>
</table>
- `duplicate`
- : This value indicates that the input image is extended along each of its borders as necessary by duplicating the color values at the given edge of the input image.
- `wrap`
- : This value indicates that the input image is extended by taking the color values from the opposite edge of the image.
- `none`
- : This value indicates that the input image is extended with pixel values of zero for R, G, B and A.
## feGaussianBlur
For {{SVGElement("feGaussianBlur")}}, `edgeMode` determines how to extend the input image as necessary with color values so that the matrix operations can be applied when the kernel is positioned at or near the edge of the input image.
<table class="properties">
<tbody>
<tr>
<th scope="row">Value</th>
<td><code>duplicate</code> | <code>wrap</code> | <code>none</code></td>
</tr>
<tr>
<th scope="row">Default value</th>
<td><code>none</code></td>
</tr>
<tr>
<th scope="row">Animatable</th>
<td>Yes</td>
</tr>
</tbody>
</table>
- `duplicate`
- : This value indicates that the input image is extended along each of its borders as necessary by duplicating the color values at the given edge of the input image.
- `wrap`
- : This value indicates that the input image is extended by taking the color values from the opposite edge of the image.
- `none`
- : This value indicates that the input image is extended with pixel values of zero for R, G, B and A.
## Specifications
{{Specifications}}