9

I have created a simple html-based web-page consisting of a form and some text, plus a canvas. I would like to print the page including the canvas on a piece of paper, the problem is - the canvas will not show in the print-out. Is it something I have missed in how to handle the canvas? I am currently using Opera, any knowledge whether other browsers handle this better?

tanus
  • 93
  • 1
  • 1
  • 3
  • According to http://stackoverflow.com/questions/8031016/printing-the-contents-of-the-canvas-tag other browsers may not have this problem. – James Clark Dec 07 '11 at 02:32

2 Answers2

18

what you need to do in this case is, have a special print view, where the canvas gets replaced by an image file, which then can be printed out easily.

have a look here: Capture HTML Canvas as gif/jpg/png/pdf?

Community
  • 1
  • 1
Daniel Kutik
  • 6,997
  • 2
  • 27
  • 34
2

You need to use the .toDataURL() method to convert the canvas to an image, which you could place on top of the canvas itself for example, prior to printing. Maybe make a print button on the page, which does that stuff, then prints etc...

jaredwilli
  • 11,762
  • 6
  • 42
  • 41