如何使用pdf.js

Question

我正在考慮使用pdf.js（允許在網頁中嵌入pdf的開源工具）。沒有關於如何使用它的任何文檔。

我假設我所做的是在頭文件中引用的腳本創建一個html頁面，然後在正文中，我使用文件名和位置的數組進行某種函數調用。有人可以幫我從這裏出去嗎？

Answer 1

嘗試Google'ing pdf.js documentation

/* create the PDF document */ 

var doc = new pdf(); 
doc.text(20, 20, 'hello, I am PDF.'); 
doc.text(20, 30, 'i was created in the browser using javascript.'); 
doc.text(20, 40, 'i can also be created from node.js'); 

/* Optional - set properties on the document */ 
doc.setProperties({ 
    title: 'A sample document created by pdf.js', 
    subject: 'PDFs are kinda cool, i guess',   
    author: 'Marak Squires', 
    keywords: 'pdf.js, javascript, Marak, Marak Squires', 
    creator: 'pdf.js' 
}); 

doc.addPage(); 
doc.setFontSize(22); 
doc.text(20, 20, 'This is a title'); 
doc.setFontSize(16); 
doc.text(20, 30, 'This is some normal sized text underneath.'); 

var fileName = "testFile"+new Date().getSeconds()+".pdf"; 
var pdfAsDataURI = doc.output('datauri', {"fileName":fileName}); 

注：這裏所說的 「pdf.js」 項目是https://github.com/Marak/pdf.js，並已被廢棄了，因爲這個答案被張貼。 @ Treffynnon的答案是關於大多數搜索者都在尋找的仍然活躍的Mozilla項目（https://github.com/mozilla/pdf.js）。

Answer 2

他們的github readme上有文檔可用。他們引用的following example code：

/* -*- Mode: Java; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */ 
/* vim: set shiftwidth=2 tabstop=2 autoindent cindent expandtab: */ 

// 
// See README for overview 
// 

'use strict'; 

// 
// Fetch the PDF document from the URL using promises 
// 
PDFJS.getDocument('helloworld.pdf').then(function(pdf) { 
    // Using promise to fetch the page 
    pdf.getPage(1).then(function(page) { 
    var scale = 1.5; 
    var viewport = page.getViewport(scale); 

    // 
    // Prepare canvas using PDF page dimensions 
    // 
    var canvas = document.getElementById('the-canvas'); 
    var context = canvas.getContext('2d'); 
    canvas.height = viewport.height; 
    canvas.width = viewport.width; 

    // 
    // Render PDF page into canvas context 
    // 
    var renderContext = { 
     canvasContext: context, 
     viewport: viewport 
    }; 
    page.render(renderContext); 
    }); 
});