lottiejs

问题

一时兴起想在html页面上增加天气预报功能，在接了天气接口后需要选择天气图标。这时发现了lottie动画。
Lottie 是一个应用十分广泛的动画库，适用于Android、Ios、Web、ReactNative、Windows。
它解析了用Bodymovin导出为json的Adobe After Effects动画，并在移动和网络上进行原生渲染。
知道这就差不多啦，就是json文件格式的动画(可以通过json文件的修改直接对动画进行修改,例如去掉背景等操作 )。

解决

直接上代码

<script crossorigin="anonymous"
  integrity="sha512-yAr4fN9WZH6hESbOwoFZGtSgOP+LSZbs/JeoDr02pOX4yUFfI++qC9YwIQXIGffhnzliykJtdWTV/v3PxSz8aw=="
  src="https://lib.baomitu.com/lottie-web/5.9.6/lottie.min.js"></script>
  var anim = undefined;
  var animData = {
    wrapper: document.getElementById('bodymovin'),
    animType: 'html',
    loop: true,
    prerender: true,
    autoplay: true,
    path: weatherImgPath

  };
 if (anim) {
   anim.destroy();
   weatherImgPath = 'lottie/thunder.json';
 }
 animData.path = weatherImgPath;
 anim = bodymovin.loadAnimation(animData);