Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Use pdf.js [closed]

I am considering using pdf.js (an open source tool that allows embedding of a pdf in a webpage). There isn't any documentation on how to use it.

I assume what I do is make an html page with the script referenced in the header, and then in the body, I put some sort of function call with an array of the file name and location. Can anyone help me out here?

like image 840
Chris Avatar asked Feb 17 '12 12:02

Chris


People also ask

Does PDF JS work on Chrome?

What Browsers does PDF. js Support. PDF. js is used within Mozilla Firefox today as the built-in PDF viewer, and it works well within a website when viewed using the latest versions of Chrome and Firefox, whether through the pre-built PDF.

Is PDF JS free to use?

PDF. js is a good free option if you're willing to invest time into implementing a UI for it. The project comes with some examples and API docs.

Does Firefox use PDF JS?

PDF. js was originally created as a extension for Firefox and is included in Firefox since 2012.


2 Answers

There is documentation available on their github readme. They cite the 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);   }); }); 
like image 121
Treffynnon Avatar answered Oct 05 '22 15:10

Treffynnon


Try 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}); 

NOTE: the "pdf.js" project mentioned here is https://github.com/Marak/pdf.js, and has been deprecated since this answer was posted. @Treffynnon's answer is about the still-active Mozilla project (https://github.com/mozilla/pdf.js) that most searchers will be looking for.

like image 34
James Hill Avatar answered Oct 05 '22 15:10

James Hill