应用fedisplacementmap过滤器后的SVG边缘平滑/抗锯齿

时间:2015-09-23 06:50:26

标签: svg filter

FeDisplacementMap过滤器给我锯齿状/像素化边缘。我有一个长方形的盒子,里面装满了水平的B& W条纹图案。我根据我的要求用fedisplacementmap弯曲矩形。但所有的边缘都变得像素化/锯齿状。我尝试了fegussionblur,convolvematrix和边缘检测,仍然没有成功,任何帮助将不胜感激。

问题链接:http://www.avisone.com/TEST.svg

应该是这样的:http://www.avisone.com/result.png

这是我的过滤器

<filter id="f3" filterUnits="userSpaceOnUse" x="0%" y="0%" width="100%" height="200%" filterRes="1600">
<feImage xlink:href="img/bubble.png" result="Map" y="0.133844" width="0.36074" height="0.1"/>
<feDisplacementMap in2="Map" color-interpolation-filters="sRGB" in="SourceGraphic"  yChannelSelector="R" xChannelSelector="G" scale="0.00">
<animate attributeName="scale" dur="10s" values="0.00;0.12;0.00"  repeatCount="indefinite"/></feDisplacementMap>
  <!-- tried but result not good-->
<!--feGaussianBlur in="DDD" stdDeviation="0.9" result="blur" />
  <feMerge>        
    <feMergeNode in="DDD"/>
    <feMergeNode in="blur"/>
  </feMerge-->   
</filter>

0 个答案:

没有答案