<feMerge>
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.
<feMerge> SVG cho phép các hiệu ứng bộ lọc được áp dụng đồng thời thay vì tuần tự. Điều này đạt được bằng cách các bộ lọc khác lưu đầu ra của chúng thông qua thuộc tính result rồi truy cập nó trong một phần tử con <feMergeNode>.
Giống như các primitive bộ lọc khác, nó xử lý các thành phần màu trong color space linearRGB theo mặc định. Bạn có thể dùng color-interpolation-filters để dùng sRGB thay thế.
Ngữ cảnh sử dụng
| Categories | Filter primitive element |
|---|---|
| Permitted content | Any number of the following elements, in any order:<feMergeNode> |
Thuộc tính
Giao diện DOM
Phần tử này triển khai giao diện SVGFEMergeElement.
Ví dụ
>SVG
html
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<filter id="feOffset" x="-40" y="-20" width="100" height="200">
<feOffset in="SourceGraphic" dx="60" dy="60" />
<feGaussianBlur stdDeviation="5" result="blur2" />
<feMerge>
<feMergeNode in="blur2" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
<rect
x="40"
y="40"
width="100"
height="100"
stroke="black"
fill="green"
filter="url(#feOffset)" />
</svg>
Kết quả
Đặc tả
| Specification |
|---|
| Filter Effects Module Level 1> # feMergeElement> |
Tương thích trình duyệt
Xem thêm
- SVG Filter primitive attributes
- thuộc tính
flood-color - thuộc tính
flood-opacity <filter><feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feFlood><feGaussianBlur><feImage><feMergeNode><feMorphology><feOffset><feSpecularLighting><feTile><feTurbulence>- Hướng dẫn SVG: Hiệu ứng bộ lọc