编程语言
首页 > 编程语言> > javascript – 如何用PDF.JS显示整个PDF(不仅仅是一页)?

javascript – 如何用PDF.JS显示整个PDF(不仅仅是一页)?

作者:互联网

我创建了这个演示:

http://polishwords.com.pl/dev/pdfjs/test.html

它显示一页.我想显示所有页面.一个在另一个之下,或者放置一些按钮来更改页面,甚至更好地加载PDF.JS的所有标准控件,就像在Firefox中一样.如何实现这个?

解决方法:

PDFJS有一个成员变量numPages,所以你只需要遍历它们.但重要的是要记住,在pdf.js中获取页面是异步的,因此订单无法保证.所以你需要链接它们.你可以沿着这些方向做点什么:

var currPage = 1; //Pages are 1-based not 0-based
var numPages = 0;
var thePDF = null;

//This is where you start
PDFJS.getDocument(url).then(function(pdf) {

        //Set PDFJS global object (so we can easily access in our page functions
        thePDF = pdf;

        //How many pages it has
        numPages = pdf.numPages;

        //Start with first page
        pdf.getPage( 1 ).then( handlePages );
});



function handlePages(page)
{
    //This gives us the page's dimensions at full scale
    var viewport = page.getViewport( 1 );

    //We'll create a canvas for each page to draw it on
    var canvas = document.createElement( "canvas" );
    canvas.style.display = "block";
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    //Draw it on the canvas
    page.render({canvasContext: context, viewport: viewport});

    //Add it to the web page
    document.body.appendChild( canvas );

    //Move to next page
    currPage++;
    if ( thePDF !== null && currPage <= numPages )
    {
        thePDF.getPage( currPage ).then( handlePages );
    }
}

标签:pdf-js,javascript,pdf
来源: https://codeday.me/bug/20191004/1851815.html