Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is possible extract data:image of canvas element? [duplicate]

Possible Duplicate:
Converting Canvas element to Image and storing in database

I have a canvas element and i want the "data:image/png;base64" of this element. Is possible extract this?

like image 739
fpilee Avatar asked Jan 15 '13 13:01

fpilee


People also ask

How do I get image data from canvas?

To get the image data for each pixel of a rectangular area on the canvas, we can get the image data object with the getImageData() method of the canvas context and then access the pixel data from the data property. Each pixel in the image data contains four components, a red, green, blue, and alpha component.

Can I get image from canvas element and use it in IMG SRC tag?

To get image from canvas element and use it in img src tag with JavaScript, we can use the canvas toDataURL method. const image = new Image(); image.id = "pic"; image. src = canvas. toDataURL(); document.


1 Answers

You can use the toDataURL function of Canvas. It makes exactly what you ask for.

var dataURLstring = canvas.toDataURL();

MDN documentation : HTML Canvas

Returns a data: URL containing a representation of the image in the format specified by type (defaults to PNG).

like image 83
Denys Séguret Avatar answered Sep 18 '22 20:09

Denys Séguret