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?
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.
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.
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).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With