打印多页HTML5画布元素

这是我在这里问过的第一个问题，通常我可以找到解决所有问题的答案。不过，本周我已经碰壁了。打印多页HTML5画布元素

我在我的页面上使用的画布效果很好，可以保存为图像文件。我还创建了一个按钮，可以在使用toDataURL之后的新窗口中打开画布进行打印。我使用下面的代码：

function printable() { 
    var dataUrl = document.getElementById("mainCanvas").toDataURL("image/png"); 
    var windowContent = '<!DOCTYPE html>'; 
    windowContent += '<head><title>Print Map</title></head>'; 
    windowContent += '<body>'; 
    windowContent += '<img src = "' + dataUrl + '">'; 
    windowContent += '</body>'; 
    windowContent += '</html>'; 
    var printWin = window.open('', '', width = 340, height = 260); 
    printWin.document.open(); 
    printWin.document.write(windowContent); 
    printWin.document.close(); 
    printWin.focus(); 
    printWin.print(); 
}

这很好，并打开打印对话框打印我的画布图像。我的问题是，我的图像比单个页面大，只有我的图像的第一页打印。有没有什么办法可以在多个页面上打印我的画布，或者我应该把这个问题记录到打印机的不良功能中，让我的用户在本地保存画布后需要打印以使用不同的程序？

谢谢

来源

2012-05-16 Hunter Jansen

有一个愚蠢的解决方案，但肯定工作。

使用脚本来拆分画布，并将内容放到几个单独的画布上。

使用这些功能：

ImageData getImageData(in float x, in float y, in float width, in float height); 
void putImageData(in ImageData imagedata, in float dx, double dy, in float dirtyX Optional , in float dirtyY Optional , in float dirtyWidth Optional , in float dirtyHeight Optional);

来源

2012-05-16 14:17:07 xiaoyi

打印多页HTML5画布元素

回答

相关问题