Come utilizzare pdf.js [chiuso]


92

Sto valutando di utilizzare pdf.js (uno strumento open source che consente l'incorporamento di un pdf in una pagina web). Non c'è alcuna documentazione su come usarlo.

Presumo che quello che faccio sia creare una pagina html con lo script a cui si fa riferimento nell'intestazione, quindi nel corpo metto una sorta di chiamata di funzione con un array del nome del file e della posizione. Qualcuno può aiutarmi qui?


1
### Articolo Github Ho appena iniziato un articolo Setup PDF.js in un sito web sul wiki del progetto su GitHub. ### Richiesta di completamento Se hai esperienza, completa l'articolo.
Édouard Lopez

Qualcosa di più di alto livello come viewerjs.org è probabilmente quello che vuoi.
massimo

Voglio estrarre il file xml incorporato dal PDF, c'è un modo per farlo?
Ananta Prasad

Risposte:


33

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

NOTA: il progetto "pdf.js" menzionato qui è https://github.com/Marak/pdf.js ed è stato deprecato da quando è stata pubblicata questa risposta. La risposta di @ Treffynnon riguarda il progetto Mozilla ancora attivo ( https://github.com/mozilla/pdf.js ) che la maggior parte dei ricercatori cercherà.


L'ho visto ma sono confuso riguardo alle cose sopra var = filename. Ho bisogno di uno qualsiasi di quel doc.addPage () in doc.text e sopra di esso triplo doc.texts?
Chris

Un'altra domanda sarebbe: cosa devo cambiare. Presumo che il primo "nome file" dell'ultima riga debba cambiare e le proprietà del documento. È così?
Chris

25
Non è un file pdf.js diverso?
Svizzera

@Swiss, questo è di febbraio, con voti positivi e contrassegnato come risposta. Direi che questo è ciò che l'OP stava cercando.
James Hill

14
Sì, ecco perché era così confuso. L'operazione apparentemente si riferisce al progetto mozilla per la visualizzazione di pdf come html, ma il progetto a cui si fa riferimento nel blog a cui ci si collega è diverso per la creazione di file pdf utilizzando javascript.
Svizzera

50

C'è della documentazione disponibile sul loro readme di github . Citano il seguente codice di esempio :

/* -*- 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);
  });
});

19
Non è ben documentato ma estrai lo zip pdf.js e lasci intatta la sua struttura di directory. Quindi per visualizzare un pdf è sufficiente accedere al file viewer.html (tramite browser) con il file aggiunto alla fine. Ex yoursite.com/directory_that_viewer_._html_is_in/viewer.html?file=somepdfthatyouhave.pdf La posizione del pdf è appena passata come variabile GET al file viewer.html.
Craig Lafferty

4
Dal wiki di github : "Tuttavia, ti chiediamo se prevedi di incorporare il visualizzatore nel tuo sito, che non sia solo una versione non modificata. Per favore ri-skin it o costruiscilo." - data la loro documentazione api orribilmente inesistente , questo progetto ti assicura di saltare abbastanza ostacoli per rimanere in forma: \
Philzen
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.