svg動畫，截取工具有點不忍直視了~~~?

?

為了實現上面的svg動畫，可以使用bodymovin插件，簡單配置之后，就可以直接可以實現在 AE（可視化操作，不用碼代碼）上面導出 svg的json數據，在web上播放動畫了。簡直不能再小白了。

demo：

//html <div id="svgContainer" class="hide"></div>//data var svgData = 'XXXXXXXX/svg/1/data.json'; playSvg(svgData)//播放svg function playSvg(svgData) { var animItem = bodymovin.loadAnimation({wrapper: document.getElementById('svgContainer'),animType: 'svg', //也可以是canvasloop: true,autoplay: true,path: svgData // 傳入json數據});//銷毀實例$('.XXX').on('click', function() { animItem.destroy();}); }

git上的具體使用教程

轉載于:https://www.cnblogs.com/leaf930814/p/7110636.html

總結

以上是生活随笔為你收集整理的借助Bodymovin播放svg动画的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。