How to create a Gif with Canvas content

Asked

Viewed 763 times

2

I would like to know how to create a gif from a canvas, in this canvas I have a sequence of scenes, after the scenes were created I wanted to read all the scenes and then save them as one . gif

1 answer

3


canvas does not allow such operation natively, you will need an external library to be able to create a GIF.

Try jsgif

Example of use (extracted from github):

var encoder = new GIFEncoder();
  encoder.setRepeat(0); //0  -> loop forever
                        //1+ -> loop n times then stop
  encoder.setDelay(500); //go to next frame every n milliseconds
  encoder.start();
  encoder.addFrame(context);
  encoder.finish();
  var binary_gif = encoder.stream().getData();
  var data_url = 'data:image/gif;base64,'+encode64(binary_gif);

Browser other questions tagged

You are not signed in. Login or sign up in order to post.