SVG动画

制作的过程，一般都是先用绘图工具绘制出来然后再加的动画。用ai或其他矢量工具画，导出svg。

库文件

  • vivus: 可控制svg绘制动画。
  • Bonsai
  • Velocity.js:Velocity is an animation engine with the same API as jQuery's $.animate(). It works with and without jQuery.
  • Raphaël: Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web.
  • SnapSVG: Snap was written entirely from scratch by the author of Raphaël (Dmitry Baranovskiy), and is designed specifically for modern browsers (IE9 and up, Safari, Chrome, Firefox, and Opera).
  • Walkway: Walkway 支持3种方式, path, line 和 用polyline来画的svg线。它提供了一个很好的例子，绘制了一个PlayStation 的集合动画。
  • SVG.js

  • CHARTIST.JS : SIMPLE RESPONSIVE CHARTS

    参考资料

  • 如何绘制SVG格式的图标

  • svg动画的实现

原文: https://leohxj.gitbooks.io/front-end-database/content/animation/animation-svg.html