SVG进阶|SVG过滤器（SVGFilters）

　　SVG过滤器可以为SVG图形添加一些非常酷的效果，如阴影、模糊和高光等效果。
　　 SVG过滤器的例子
　　先来看一个简单的SVG过滤器的例子，直观的感受一些它的效果：

<defs>
  <filter id="blurFilter" y="-5" height="40"
      <feGaussianBlur in="SourceGraphic" stdDeviation="3" y="-"/>
  </filter>
</defs>
 
<ellipse cx="55" cy="60" rx="25" ry="15"
  style="stroke: none; fill: #663399; " />
 
<ellipse cx="155" cy="60" rx="25" ry="15"
  style="stroke: none; fill: #663399; filter: url(#blurFilter);" /> 

　　在这个例子中，对一个SVG椭圆形应用了模糊滤镜，得到的结果如下：

　　 SVG过滤器的输入和 输出
　　SVG过滤器在应用过滤效果的时候需要一个输入源。这个输入源可以是一个图形，或图形的alpha通道，或另一个过滤器的 输出值。
　　SVG过滤器可以从输入源中产生一个 输出图像。一个过滤器的 输出可以是另一个过滤器的输入，这样，过滤器可以被链接起来使用。
　　下面是一张SVG过滤器输入和 输出的说明图片：

查看更多关于SVG进阶|SVG过滤器（SVGFilters）的详细内容...