javascript - PDF.js 在固定宽度上缩放 PDF

Question

我有一个固定框，我想在其中显示由 PDF.js 呈现的 PDF。由于 PDF.js 文档并不是真正可访问的(通过它们的源文件随地吐痰)，我想知道是否可以在固定宽度上缩放呈现的 PDF。当我设置为 CSS 时:canvas { width: 600px; 对于显示 PDF 的 Canvas ，PDF 被拉伸(stretch)，质量变差。

Answer 1

我更新了 Pdf.js github 中的示例 http://jsbin.com/pdfjs-prevnext-v2/edit#html,live正确缩放到固定的 Canvas 宽度。参见 http://jsfiddle.net/RREv9/对于我的代码。

重要的是

var viewport = page.getViewport(canvas.width / page.getViewport(1.0).width);

因为表达式 canvas.width/page.getViewport(1.0).width 给了我们适当的比例因子。

您应该更改 Canvas 的宽度，而不是使用 css，而是通过 Canvas 的 width 属性。参见 Canvas width and height in HTML5