SVG.js动画系列4-滤镜动画

三零

于 2020-11-10 14:56:36 发布

阅读量358

点赞数

分类专栏： animation SVG.js 文章标签： svg filter

本文链接：https://blog.csdn.net/wangchangjiang1984/article/details/109588771

版权

本文介绍如何使用SVG.js和svg.filter.js插件创建滤镜动画。通过一个具体的动漫效果示例，展示了SVG.js的强大功能，并提供了源码链接供读者深入研究。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

给滤镜加上动画，是一个什么样的效果呢。效果图如下：
在这里插入图片描述
本示例是anime.js的滤镜动画的翻版，用SVG.js实现。代码：

var draw = SVG().addTo('body').size(800, 600)

  const points1 = "64 68.64 8.574 100 63.446 67.68 64 4 64.554 67.68 119.426 100";
  const points2 = "64 128 8.574 96 8.574 32 64 0 119.426 32 119.426 96";
  var polygon, filter, turbulence, displacementMap;
  function make

最低0.47元/天解锁文章