svga动画播放
程序员文章站
2022-03-02 19:44:43
...
安装参考svga官方github
https://github.com/svga/SVGAPlayer-Web
html
<div id='demoCanvas'></div>
js
var player = new SVGA.Player('#demoCanvas');
var parser = new SVGA.Parser('#demoCanvas');
parser.load('static/img/bullet/anim.svga', function(videoItem) {
player.loops = 2
player.clearsAfterStop = false
player.setVideoItem(videoItem)
player.startAnimation()
player.onFrame(function (i) {
})
})
api
loop 循环次数
clearsAfterStop 动画结束都是否清楚内容,注意,这里如果不设置 默认true
setVideoItem 需要获取load返回参数才能生效
startAnimation 开始动画
pauseAnimation 暂停动画
stopAnimation 停止动画
onFrame 我们可以通过这个函数知道当前动画是播放的第几帧,然后根据具体业务需求展示效果
上一篇: maven无法下载包问题解决
下一篇: svga-前端如何使用svga动画