Some test text!

< Web samples

Viewing a Document

Shows how to call WebViewer constructor to instantiate and load document. You can load local/remote files of your choice.

Step 1: Get your free trial license key, or sign in

Start Trial
Sign in

Step 2: Add the code:

// Instantiate
var viewerElement = document.getElementById('viewer');
var viewer = new PDFTron.WebViewer({
  path: '../../../lib',
  l: window.sampleL,
  pdftronServer: 'https://demo.pdftron.com/', // comment this out to do client-side only
  initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/webviewer-demo-annotated.pdf',
}, viewerElement);

viewerElement.addEventListener('ready', function() {
  var viewerInstance = viewer.getInstance();
  // TODO: to be removed
  window.viewerInstance = viewerInstance;

  document.getElementById('select').onchange = function(e) {
    if (e.target.value.indexOf('https://') === 0) {
      viewerInstance.setEngineType(viewerInstance.constants.engineTypes.AUTO);
    } else {
      viewerInstance.setEngineType(viewerInstance.constants.engineTypes.PDFNETJS);
    }
    viewerInstance.loadDocument(e.target.value);
  };

  document.getElementById('file-picker').onchange = function(e) {
    var file = e.target.files[0];
    if (file) {
      viewerInstance.setEngineType(viewerInstance.constants.engineTypes.PDFNETJS);
      viewerInstance.loadDocument(file);
    }
  };

  document.getElementById('url-form').onsubmit = function(e) {
    e.preventDefault();
    viewerInstance.loadDocument(document.getElementById('url').value);
  };
});