Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Export Canvas as .gif image [duplicate]

I've been pulling my hair out trying to export my html5 canvas a .gif image,i was able to succesfully save it as a .png file. i dnt know what am doing wrong here is my simple code

canvas.onclick = function () {
window.location = canvas.toDataURL('image/gif');
};
like image 437
Donnie Ibiyemi Avatar asked Feb 16 '13 04:02

Donnie Ibiyemi


People also ask

Does canvas support GIFs?

Embedding Images Displaying images is a good first step as you learn to embed media in Canvas. The image insertion tools allow you to add still images and animated gifs.

How do you add a GIF to a canvas in HTML?

You can't directly insert GIF image into the canvas. But we can use external library to parse the gif and then we can draw it into the layer as Konva. Image shape. In this demo I will use gifler to parse and draw the gif.

How do you put photos on canvas?

Importing images into a canvas is basically a two step process: Get a reference to an HTMLImageElement object or to another canvas element as a source. It is also possible to use images by providing a URL. Draw the image on the canvas using the drawImage() function.


1 Answers

This will answer your question. In short, try console.log'ing your data, and, not all browsers will support writing to a gif.

like image 108
Dhaivat Pandya Avatar answered Oct 10 '22 18:10

Dhaivat Pandya