16

I have a web application I'm administering for a client which uses a graphing library which generates graphs using a canvas. The client wants the user to be able to copy any graph in the site so that it can be pasted into a word document. The specific question:

Is it possible to copy an HTML canvas element to the clipboard as an image?

I know that it is possible to save a canvas as an image, but it's somewhat more cumbersome than copy/paste.

EDIT: I've learned that you can convert the canvas over to an image with a data URI src, but the copy and paste support on that image is mixed. Firefox allows you to copy and paste these images out of a browser, but chrome doesn't.

As of right now, it appears that there is not a reliable way to copy and paste a canvas element.

Brad Koch
  • 19,267
  • 19
  • 110
  • 137
  • You might consider HTML5 drag-out for Chrome (http://slides.html5rocks.com/#drag-out), which might allow you to drag and drop the image from your browser to a Word document. – Jeff Jun 02 '11 at 21:45
  • 1
    Also, if you copy an canvas-to-image from Chrome, you can paste into Word using 'paste special' – Jeff Jun 02 '11 at 21:56

1 Answers1

2

You cannot interact with clipboard directly with Javascript, but it could be possible with help of Flash.

You could try http://code.google.com/p/zeroclipboard/ as suggested here How do I copy to the clipboard in JavaScript?

Copying binary data could be problematic thou.

See also

http://danielmclaren.com/node/91

Community
  • 1
  • 1
esamatti
  • 18,293
  • 11
  • 75
  • 82
  • 2
    Yeah, you can always try tricky stuff like that, but when you start doing things like exploiting holes through plug ins you start questioning whether it's worth it for what you're getting. I've been finding out that the base64 encoded image returned by the canvas varies in behavior by browser. You can copy and paste these images out of Firefox, but in Chrome it doesn't seem to work properly. Seems really tough to build a reliable implementation; it seems like copy/paste of a canvas should just be part of the spec or something. – Brad Koch May 30 '11 at 02:09