Html 打印 html5 画布?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5217377/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 07:09:47  来源:igfitidea点击:

Print-out of a html5 canvas?

htmlcanvas

提问by tanus

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?

我创建了一个简单的基于 html 的网页,由一个表单和一些文本以及一个画布组成。我想在一张纸上打印包含画布的页面,问题是 - 画布不会显示在打印输出中。这是我在如何处理画布时遗漏的东西吗?我目前正在使用 Opera,不知道其他浏览器是否能更好地处理这个问题?

回答by Daniel Kutik

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?

看看这里:Capture HTML Canvas as gif/jpg/png/pdf?

回答by jaredwilli

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...

您需要使用 .toDataURL() 方法将画布转换为图像,例如,您可以在打印之前将其放置在画布本身的顶部。也许在页面上制作一个打印按钮,它会做那些事情,然后打印等等......