Mark the Three.Js scene in the animated GIF at custom intervals

Question

I am trying to display an animated Three.js scene (basically a dynamic power loader that automatically rotates the object 360 degrees) into a GIF file. Basically, I would like the GIF to contain frames that will be “screenshots” from the WebGL canvas every x seconds / ms.

I searched for a few hours, but I did not find any good stories on this subject.

Thanks.

Answer 1

A few years ago I did just that. You can see the code here:

https://dl.dropboxusercontent.com/u/7508542/sandbox/omggif/index.html

Answer 2

I just found this repository that seems right!

Quickly and easily create loopback GIFs using WebGL

Or maybe look at this :

Library for capturing animation on canvas