问题打印Canvas标签的内容(Chrome,Opera)

时间:2009-10-19 16:49:36

标签: javascript printing google-chrome canvas opera

这些浏览器(Windows版本)正确打印一个网页,该网页在img标记图像上有一个画布覆盖:

IE6,IE7,IE8,Firefox,Safari

但是 Chrome (我在版本3.0.195.27上输入时为最新版本)和 Opera (在我输入此版本10.0版本时为最新版本) 1750)不要。 Chrome完全忽略了画布渲染。 Opera将整个画布渲染为白色矩形,遮挡其背后的图像。

我知道canvas标签是新的,打印网页总是很冒险。我该怎么处理?是否有任何我缺少的设置才能使这项工作?我是否可以从JavaScript中捕获“即将打印”事件,至少警告用户?


更新:它甚至比它看起来还要怪。组合图像(画布覆盖img)可以在我的Brother激光打印机上正确打印,但不能在我的HP喷墨打印机上打印。

所以目前的情况是大多数浏览器都能正确打印到我的喷墨打印机,但Chrome不能。 Opera在两台打印机上都搞砸了。

这完全取决于打印机驱动程序以及各种浏览器如何与它们通信?


更新:我注意到Google文档构建了一个用于打印的PDF文件。

3 个答案:

答案 0 :(得分:2)

您可以使用PHP's PDF functions以编程方式创建PDF。这真的很容易!

创建新PDF:

$pdf = pdf_new();

打开文件:

pdf_open_file($pdf, "pdfName.pdf");

您可以设置一些变量,例如作者:

pdf_set_info($pdf, "Title", "pdf Title here");

现在您需要使用pdf_begin_page()功能:

pdf_begin_page($pdf, 595, 842);

这些是A4的尺寸。

含量

使用以下命令关闭文件:

pdf_end_page($pdf);
pdf_close($pdf);

如需完整参考,请查看PHP's PDF manual

答案 1 :(得分:1)

我想知道,如果不是渲染到<canvas>元素:如果您要渲染到非文档画布对象并在<div>上设置CSS样式而不是渲染background-image元素,它可能会正确打印"url("+myCanvasObject.toDataUrl()+")"设置为src

此外,您只需将新<img />元素的myCanvasObject.toDataUrl()属性设置为相同的{{1}}即可。这应该比我上面提到的方法更好地处理..

答案 2 :(得分:0)

我建议将页面保存为PDF并尝试打印。要打印的PDF文档应该是WYSIWYG。如果PDF呈现正确,任何打印机都应该打印好。