关于此问题已经有两个问题,但具体问题仍然没有答案。
我有一份多页pdf文件。我已成功使用pdf.js核心将页面写入画布。很快我确定我将有上一个/下一个分页功能,所以我可以看到每一页。 查看我底部的现有代码。我不使用查看器的原因是因为我的老板不喜欢它。他想要一个完全不同的界面,这是非常简单和简单的,我已经成功地构建了减去完整的打印,ala:
请注意,pdf文档没有网址。我从api调用中获取数据,返回base64数据。我的代码将数组中的数据加载到pdf中。
我当前的打印功能看起来像是黑客,我知道pdf.js查看器不是这样做的。我想像pdf.js查看器一样打印pdf;意思,真实的形式。我不确定将每个页面转换成图像是否可以完成,但我仍然愿意接受建议。
问题是:原始文档中没有额外的边距,页眉/页脚。更不用说pdf文档实际上可以包含每个页面的不同页面布局和大小,并将图像标记扔进新窗口完全忽略它。
我确实检查了Github上的pdf.js examples。它们都没有打印,他们说不支持使用pdf.js而不支持查看器,如果我们这样做,我们就是自己的(是吗?)。无论如何,谷歌上没有我能找到的东西。
var pdfDocument;
var canvas;
// load from base64 data
loadPdfDocument(file.Content);
function print() {
var doc = document.getElementById('document');
var html = doc.innerHTML;
if (canvas)
html = "<img src='" + canvas.toDataURL() + "'";
var win = window.open('', '', '');
win.document.write(html);
win.document.close();
win.focus();
win.print();
win.close();
};
function loadPdfDocument(base64Data) {
PDFJS.disableWorker = true;
var pdfData = base64ToUint8Array(base64Data);
PDFJS.getDocument(pdfData).then(function(pdf) {
canvas = document.getElementById('pdfPage');
pdfDocument = pdf;
loadPdfPage(1);
});
}
function base64ToUint8Array(base64) {
var raw = atob(base64); // convert base 64 string to raw string
var uint8Array = new Uint8Array(raw.length);
for (var i = 0; i < raw.length; i++) {
uint8Array[i] = raw.charCodeAt(i);
}
return uint8Array;
}
function loadPdfPage(pageIndex) {
pdfDocument.getPage(pageIndex).then(function(page) {
var scale = 1;
var viewport = page.getViewport(scale);
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
page.render({
canvasContext: context,
viewport: viewport
});
});
}
<div id="document">
<canvas id="pdfPage" />
</div>