Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
1

Lottie Number Counter glitch

Explorer ,
Sep 11, 2023 Sep 11, 2023

I made an animation for a client and they wanted it to be a lottie json to implement into their app. I had some problems with the lottie exports but was able to fix all of them except for the number counter.

I tried the counter expression with a slider and as pure javascript but got the same result with both ways.

 

Does someone know how to fix this lottie export issue?

The file as a video and a screencapture of the lottie are in the attachment.

 

Thanks in advance,

Josh

TOPICS
Error or problem , Import and export , Scripting
522
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Sep 11, 2023 Sep 11, 2023

And what is the actual code? It seems you assume that stuff like linear(), ease() or whatever exist in generic JS when you may need to implement your own code or some sort of node.js third-party library.

 

Mylenium

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Sep 11, 2023 Sep 11, 2023
LATEST

I was browsing some web discussions about number counters with lottie and it seemed to work for some people so I guessed it would work with simple javascript.

 

This is the code I'm using;

 

var startValue = 50; // Starting value
var endValue = 100; // Ending value
var duration = 1; // Duration in seconds
var delay = 3.675; // Delay in seconds
var currentValue = Math.round(linear(Math.max(time - delay, 0), 0, duration, startValue, endValue));
currentValue + "%";

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines