我有一个4页的pdf,每个页面都有一个透明的背景 . 我使用pdf.js来显示它们,但我想在我的html页面上用透明背景显示它们但我无法弄清楚我是如何做到的,总是有一个白色背景:
我认为根据this issue是可能的,但是当我将行 page.render(renderContext); 更改为 page.render({renderContext, viewport, backgroundColor: 'rgba(0,0,0,0)' }); 时(正如它在问题中所述)我有以下错误:
关于如何管理它的任何想法?
我使用pdf.js版本v1.9.426和Firefox 55.0.2(64位) .
EDIT : 使用以下代码我在控制台中没有错误,但我的pdf文件的背景仍为白色 . (但是,如果用例如photoshop打开pdf则没有背景)
链接到我使用的PDF文件:tempPDF.pdf
这是我的javascript文件,显示四个页面:
var pdfFile;
PDFJS.getDocument('/assets/pdf/tempPDF.pdf').then(function (pdf) {
pdfFile = pdf;
for(var i = 1; i <= 5; i++) {
var canvas = document.getElementById('canvas'+i);
var context = canvas.getContext('2d');
PDFJS.disableStream = true;
openPage(pdf, i, context, 50);
}
});
function openPage(pdfFile, pageNumber, context, ratio) {
var scale = 10;
pdfFile.getPage(pageNumber).then(function (page) {
viewport = page.getViewport(scale);
// reference canvas via context
var canvas = context.canvas;
canvas.width = viewport.width;
canvas.height = viewport.height;
canvas.style.width = ratio+"%";
canvas.style.height = ratio+"%";
var renderContext = {
canvasContext: context
, viewport: viewport
};
page.render({canvasContext: context, viewport: viewport, backgroundColor: 'rgba(0,0,0,0)' });
//page.render(renderContext);
});
}
我的html页面可能有用:
style="background-color:powderblue;">
My page