All geek questions in one place

Running boot from canvas.toDataURL on the client side?

I have a canvas element on the page. I call canvas.toDataURL () and now have an image data descriptor.

Do I need to put this data on the server, do my server have a file stream using this data, and then set the location of my document in the returned file stream? It seems like a lot of overhead when I have all the client side of the data ...

+4
source share
2 answers

Of course check out Canvas2Image.js

// returns an <img> element containing the converted PNG image var oImgPNG = Canvas2Image.saveAsPNG(oCanvas, true); // returns an <img> element containing the converted JPEG image (Only supported by Firefox) var oImgJPEG = Canvas2Image.saveAsJPEG(oCanvas, true); // returns an <img> element containing the converted BMP image var oImgBMP = Canvas2Image.saveAsBMP(oCanvas, true);

Internally, all of this is done by base64, encoding the data and calling document.location.href = base64EncodedData; .

+1
source

you can install DataURL in img elem

 var plane = document.getElementsByTagName ( "canvas" )[0], ctx = plane.getContext("2d"), img = document.createElement("img"); ctx.fillRect ( 0,0,400,400 ); img.src = plane.toDataURL(); document.body.appendChild ( img );

of course, old, i.e. does not support this

0
source

Source: https://habr.com/ru/post/1397926/

More articles:


All Articles