Extracting single frames from an animated GIF to canvas

javascript html canvas animated-gif
Omiod picture Omiod · Jan 10, 2011 · Viewed 11.7k times · Source

I need to load all the frames of an animated GIF to an HTML5 canvas.

Please note, I don't want to "play" the animated (someone asked this before), all I want is to extract all the frames to use them as single images.

Answer

Brendan picture Brendan · Jul 2, 2013

Buzzfeed have librarified the code from the repo tommitytom posted. I haven't tried it yet but it looks good.

https://github.com/buzzfeed/libgif-js

Related questions

How to clear the canvas for redrawing

After experimenting with composite operations and drawing images on the canvas I'm now trying to remove images and compositing. How do I do this? I need to clear the canvas for redrawing other images; this can go on for a …

Read More
Capture HTML Canvas as gif/jpg/png/pdf?

Is it possible to capture or print what's displayed in an html canvas as an image or pdf? I'd like to generate an image via canvas, and be able to generate a png from that image.

Read More
Using HTML5/Canvas/JavaScript to take in-browser screenshots

Google's "Report a Bug" or "Feedback Tool" lets you select an area of your browser window to create a screenshot that is submitted with your feedback about a bug. Screenshot by Jason Small, posted in a duplicate question. How are …

Read More