<feMerge>
åºçº¿
广æ³å¯ç¨
èª 2015å¹´7æ èµ·ï¼æ¤ç¹æ§å·²å¨ä¸»æµæµè§å¨ä¸å¾å°æ¯æï¼å¯å¨å¤§å¤æ°è®¾å¤åæµè§å¨çæ¬ä¸æ£å¸¸ä½¿ç¨ã
<feMerge> SVG å
ç´ å
è®¸æ»¤éææå¹¶ååºç¨ï¼è䏿¯ä¾æ¬¡åºç¨ãå®ç°æ¹å¼æ¯ç±å
¶ä»æ»¤ééè¿ result 屿§åå¨å
¶è¾åºï¼ç¶åå¨ <feMergeNode> åå
ç´ ä¸è®¿é®è¯¥è¾åºã
ä¸å
¶ä»æ»¤éåè¯ä¸æ ·ï¼å®é»è®¤å¨ linearRGB è²å½©ç©ºé´ä¸å¤çé¢è²åéãä½ å¯ä»¥ä½¿ç¨ color-interpolation-filters æ¹ä¸ºä½¿ç¨ sRGBã
使ç¨ä¸ä¸æ
| ç±»å« | 滤éå ç´ |
|---|---|
| å 许çå 容 | ä»»ææ°éãä»»æé¡ºåºçä¸åå
ç´ ï¼<feMergeNode> |
屿§
DOM æ¥å£
该å
ç´ å®ç°äº SVGFEMergeElement æ¥å£ã
示ä¾
>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>
ç»æ
è§è
| è§è |
|---|
| Filter Effects Module Level 1 > # feMergeElement > |
æµè§å¨å ¼å®¹æ§
åè§
- SVG 滤éåè¯å±æ§
flood-color屿§flood-opacity屿§<filter><feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feFlood><feGaussianBlur><feImage><feMergeNode><feMorphology><feOffset><feSpecularLighting><feTile><feTurbulence>- SVG æç¨ï¼æ»¤éææ