lottie 动画播放速度太快

Question

我用lottie在网页上添加了demo动画，但是播放速度太快了。我如何达到正常速度？下面的link是有问题的动画

问题动画link：https://saybgm.github.io/Lottie_example/

After Effect 文件：https://drive.google.com/file/d/1YGqgiuU-hU5Raq2WXu3r1ZrCANXB_Gw9/view?usp=sharing

我的代码

var animate = lottie.loadAnimation({
container: document.getElementById("hello"),
renderer: 'svg',
autoplay: true,
loop:true,
path: 'animation2.json'})

Answer 1

我认为问题出在动画文件中，尝试使用 Lottiefiles 预览，它看起来与您的代码运行时相同：https://www.lottiefiles.com/share/TNdLkQ

如果你想让它变慢，调用setSpeed（1是当前速度，<1会变慢）：

var animate = lottie.loadAnimation({
  container: document.getElementById("hello"),
  renderer: 'svg',
  autoplay: true,
  loop:true,
  path: 'animation2.json'
});
animate.setSpeed(0.1);

来自文档：http://airbnb.io/lottie/web/getting-started.html

Answer 2

您也可以在 XML 文件上处理它。转到 Lottie 标记，然后实施

app:lottie_speed="any number"

Answer 3

如果你使用的是react，你也可以直接在组件上设置速度

<LottieView
  speed={0.2}
  ref={animation}
  loop={true}
  autoPlay={true}
  ...
/>

Answer 4

如果您遵循在 React 中实现 Lottie 的新方法，您可以像这样使用它（类似于获得我赞成票的 Michael 的回答）：

 <Lottie
        options={defaultOptions}
        height={'100%'}
        width={'100%'}
        isStopped={false}
        isPaused={false}
        speed={0.25}
      />

lottie 动画播放速度太快

lottie animation is playing too fast

lottie