关于pdf.js的PDF查看器分辨率

Question

我是一个新手，以PDF查看器，以及对如何设置通过pdf.js背景下的分辨率的一些问题，以下是我的代码片段：

<script type="text/javascript"> 
PDFJS.getDocument('https://cdn.rawgit.com/mozilla/pdf.js/master/web/compressed.tracemonkey-pldi-09.pdf').then(function (pdf) { 
     for (var pageNum = 1; pageNum < pdf.numPages; ++pageNum) { 
      pdf.getPage(pageNum).then(function (page) { 
       // you can now use *page* here 

       var scale = 2; 
       var viewport = page.getViewport(scale); 

       var canvas = document.createElement('canvas'); 
       var context = canvas.getContext('2d'); 
       canvas.height = viewport.height; 
       canvas.width = viewport.width; 

       var renderContext = { 
        canvasContext: context, 
        viewport: viewport 
       }; 
       page.render(renderContext); 

       document.getElementById('pdf-container').appendChild(canvas); 
      }); 
     } 
    }) 

</script> 

<form id="form1" runat="server"> 
    <div> 
    </div> 
     <div id="pdf-container"></div> 
</form> 

主要问题是页面分辨率低，使内容不干净，不像 http://mozilla.github.io/pdf.js/web/viewer.html。如何使用pdf.js设置分辨率以使其像查看器一样。非常感谢。

Answer 1

我找到了一种方法来使分辨率更好，但我没有找到一个数学方程来表示。

<script type="text/javascript"> 
     PDFJS.getDocument('https://cdn.rawgit.com/mozilla/pdf.js/master/web/compressed.tracemonkey-pldi-09.pdf').then(function (pdf) { 
      for (var pageNum = 1; pageNum < pdf.numPages; ++pageNum) { 
       pdf.getPage(pageNum).then(function (page) { 
        var canvas = document.createElement('canvas'); 
        var context = canvas.getContext('2d'); 
        canvas.style.height = "1000px"; 
        canvas.style.width = "900px"; 
        var scale = 2.5; 
        var viewport = page.getViewport(scale); 
        canvas.height = viewport.height; 
        canvas.width = viewport.width; 
        console.log("canvas.height=" + canvas.height); 
        console.log("canvas.width=" + canvas.width); 
        console.log("canvas.style.height=" + canvas.style.height); 
        console.log("canvas.style.width=" + canvas.style.width); 
        console.log("scale="+scale); 
        var renderContext = { 
         canvasContext: context, 
         viewport: viewport 
        }; 
        page.render(renderContext); 
        document.getElementById('pdf-container').appendChild(canvas); 
       }); 
      } 
     }) 

    </script> 

设置canvas的宽度和高度的样式为静态值，然后使用getViewport的比例，设置canvas的宽度和高度。在这种情况下，上下文的dpi会更好，如果比例越高，dpi的分辨率就会越高。