我正在使用 PDF.js 插件在我的polymerjs 应用程序中显示 pdf。有时 pdf 内容会颠倒呈现。以下是我使用 PDF.js 的方式:
downloadPdf: function(item) {
var pdfJsInitParams = {
url: app.baseURL + item.report_pdf,
httpHeaders: app.user.token
};
PDFJS.getDocument(pdfJsInitParams).promise.then(function(pdf) {
function renderPage(pageNumber, eltId) {
if(pdf.numPages < pageNumber) {
return;
}
pdf.getPage(pageNumber).then(function(page) {
var scale = 1.3;
var viewport = page.getViewport(scale);
// Prepare canvas using PDF page dimensions
var canvas = document.getElementById(eltId);
if(canvas) {
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
// Render PDF page into canvas context
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
}
}).catch(function(err) {
showToastWithText(err, 'error');
});
}
renderPage(1, 'report_1');
renderPage(2, 'report_2');
});
}
有什么想法可能导致此问题吗?
最佳答案
(看起来downloadPdf在短时间内被多次调用)
render() 操作是异步的,您需要等待其完成才能在同一 Canvas 上开始新的渲染,请参阅 https://github.com/mozilla/pdf.js/blob/master/examples/learning/prevnext.html例子。如果您不想等待,请创建一个新 Canvas 。
关于javascript - PDF.js 文档随机颠倒显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44885973/