pdf.js

pdfjsLib.getDocument打开pdf文档
pdfDoc.getPage(num).then(function(page) {

var viewport = page.getViewport({scale: scale});

由每一页的viewport决定canvas的大小

page.render(renderContext);
page.getTextContent, 抽取pdf的文本

如果同时绘制多页pdf, 需要特殊处理, 把它们一次链接起来.
https://stackoverflow.com/questions/31891907/prevent-simultanous-function-calls-when-using-pdf-js

在typescript中导入对象, 正确姿势参考链接:
https://stackoverflow.com/questions/45467843/importing-pdfjs-breaks-ts-application

pdf.js, 有一层canvas, canvas下面有一层textlayer, 颜色是透明的.

如何设置oss的Accept-Ranges
阿里云部分下载的文章: 
https://help.aliyun.com/knowledge_detail/39571.html?spm=5176.11065259.1996646101.searchclickresult.63861141oYl26T
https://stackoverflow.com/questions/40620638/how-to-set-range-header-from-client-with-pdf-js

在pdf上绘制红色四边形:
https://stackoverflow.com/questions/58590845/draw-rectangle-in-canvas-with-loaded-pdf-file-using-pdf-js

关于workerSrc以及disableWorker = true的帖子:
https://stackoverflow.com/questions/27724295/pdf-js-failing-on-getdocument
https://github.com/mozilla/pdf.js/issues/1231

 

如果使用的pdf.js是发布给web viewer使用的, 那就必须设置PDFJS.workerSrc, 如果不设置的话, 
就必须设置PDFJS.disableWorker = true;

如何阻止pdf里面的超链被点击

https://stackoverflow.com/questions/31053948/how-to-disable-hyperlinks-within-a-pdf-rendered-by-pdf-js

Hello World介绍:

https://mozilla.github.io/pdf.js/examples/

hello world代码:

https://mozilla.github.io/pdf.js/examples/

Getting Started介绍(重要!):

https://mozilla.github.io/pdf.js/getting_started/

pdf.js是显示层, pdf.worker.js是core层, viewer.js是viewer层.

一个完整例子的视频讲解:

https://www.youtube.com/watch?v=ydCSSgwZjzs&t=542s

https://www.youtube.com/watch?v=1ZNeP7cjADo

只要设置canvas的宽和高, 就等于清空canvas的内容了.

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章