1. 所谓 “高斯模糊的边界问题” 介绍
相信有很多刚刚接触SVG滤镜模糊的新人们都可能遇到过这种问题:
1. 当模糊偏量很小的时候:
<svg width="100%" height="100%" viewBox="0 0 150 360"
preserveAspectRatio="xMidYMid meet"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<filter id="filter1">
<!--stdDeviation为 1 -->
<feGaussianBlur in="SourceGraphic" stdDeviation="1" result="Gau1"/>
</filter>
<circle cx="40" cy="40" r="10" fill="blue" filter="url(#filter1)"></circle>
</svg>
这是我们期望的并且没有什么问题:
- 当偏量略大时(对于半径为10时,2偏量的模糊已经出现了问题):
<svg width="100%"