Bodymovinを使った方法

<div class="lottie"></div>
        
<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.11.0/lottie.min.js"></script>
<script>
  bodymovin.loadAnimation({
    container: document.querySelector('.lottie'),
    renderer: 'svg',
    loop: true,
    autoplay: true,
    path: '../images/lottie.json'
  });
</script>