Capture a div as an image [duplicate]

Question

This question already has an answer here:

• user capture div as image and save to computer 4 answers

I have some div tags containing charts rendered by javascript. I want to export them in an image format by the press of a button. I don't know if it's possible to capture a div tag as an image using javascript ! so there i'm asking for tips and hints. Thanks in advance.

Answer 1

You can create an image using the canvas element. If your charts are rendered using HTML elements you need to draw that HTML onto the canvas. Then you can use toDataURL on the canvas to get the B64-encoded image data.

Answer 2

There was a dissussion here: html5: copy a canvas to image and back Also there is a project http://www.nihilogic.dk/labs/canvas2image/

Answer 3

This is not possible using only JavaScript.

JavaScript has no access on a PC to save files, nor can it convert the DOM to a image format.

Answer 4

1. JS can't access to displayed in case he can't parse HTML
2. You can call some utility to make screenshot of area. But it's not safe to use, so it will work if you give access.
3. This question was already asked here. Probably it has some good things you need

Answer 5

u might try phantomjs, http://phantomjs.org/, although I have'nt used it personally, but it is widely used for screen captures