Lottie-web: Wrong frame references, playSegments() vs. goToAndStop()

Created on 17 Jul 2019  路  2Comments  路  Source: airbnb/lottie-web

Thanks for the beautiful work! I love lottie, but there seems to be something wrong with frame references.

Environment: Anims created with AE 2018 from Illustrator 2018 files as SVG. Tested in FF 68.0 on PC using lottie.js 5.5.6

I got a character animation in AE containing different moves and scenes. Now playing a loop with playSegments() and afterwards playing some single frames with goToAndStop(), the frame references get shifted.

Let's say the AE original has a walk loop from frame 5 to 10 and some single frame character states between 15 an 20. After playing the loop using playSegments([5,10], true), I can't play one of the frames between 15 and 20 using goToAndStop() with their original frame numbers. The first frame has obviously been shifted to 5 now and the original frames numbered 15 to 20 are now frames 10 to 15.

This is somehow confusing. If playSegments() is cropping the frame numbers, how can I reset that? And if it is cropping frames, why only the beginning and not the end?

This is what happens:

0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
goToAndStop(15) shows frame 15

playSegments([5,10], true)
0 1 2 3 4 [5 6 7 8 9 10] 11 12 13 14 15 16 17 18 19 20
goToAndStop(15, true) shows frame 20!
goToAndStop(0, true) shows frame 5! Can't access frames 0 to 4.
for goToAndStop() original frame 5 is now frame 0!

playSegments([0,5], true)
[0 1 2 3 4 5] 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
goToAndStop(15) shows frame 15!
for goToAndStop() frame 15 is now frame 15 again!

I found a note here to use resetSegements() but it doesn't seem to work.
The real problem is, that after playing a loop with high frame numbers, all frames below that cant be reached any more with goToAndPlay(). Any idea how I can fix that?

Most helpful comment

Thanks @bodymovin, it works now. Should be mentioned in the docs.

All 2 comments

yes, goToAndStop is relative, not absolute, so you need to take into account the firstFrame property of the animation to adjust accordingly.

Thanks @bodymovin, it works now. Should be mentioned in the docs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

dulllud picture dulllud  路  3Comments

deborabm picture deborabm  路  3Comments

samiam2017 picture samiam2017  路  3Comments

ritsraghani picture ritsraghani  路  3Comments

ochanje210 picture ochanje210  路  3Comments