Global

Methods


getInstance( [element])

Gets an already existing instance of WebViewer. If only one instance of WebViewer exists on the page, then 'element' is not required, and the function will return the instance of WebViewer. If more than one instance of WebViewer exists, you must pass in the DOM element containing the instance of WebViewer you want to retrieve. This function can be imported directly as a module as well.
Parameters:
Name Type Argument Description
element HTMLElement <optional>
The DOM element containing the instance of WebViewer you want to retrieve
Returns:
Returns an instance of WebViewer. Returns null if no instances are available.
Type
WebViewerInstance
Example
import { getInstance } from '@pdftron/webviewer'

// After WebViewer has already been constructed
const instance = getInstance();

WebViewer(options, viewerElement)

A function that creates an instance of WebViewer, and embeds it on the HTML page
Parameters:
Name Type Description
options WebViewerOptions
viewerElement HTMLElement
Properties:
Name Type Description
WorkerTypes WorkerTypes The types of workers that can be preloaded in WebViewer
BackendTypes BackendTypes The types of backend workers.
Returns:
A promise resolved with WebViewer instance.
Type
Promise.<WebViewerInstance>
Example
WebViewer({
      licenseKey: 'Insert commercial license key here after purchase'
    }, document.getElementById('viewer'))
      .then(function(instance) {
        const documentViewer = instance.Core.documentViewer;
        const annotationManager = instance.Core.annotationManager;
        // call methods from instance, documentViewer and annotationManager as needed

        // you can also access major namespaces from the instances as follows:
        // const Tools = instance.Core.Tools;
        // const Annotations = instance.Core.Annotations;
      });

Type Definitions


BackendTypes

The types of backend workers. Pass "asm" to force the use of the ASM.js worker, "ems" to force the use of the WebAssembly worker (or ASM.js on non-wasm browsers) or "wasm-threads" to use threaded WebAssembly.
Properties:
Name Type Description
ASM string 'asm' Use of ASM.js worker.
WASM string 'ems' Use of the WebAssembly worker (or ASM.js on non-wasm browsers).
THREADED_WASM string 'wasm-threads' Use of threaded WebAssembly worker.

WebViewerOptions

Type:
  • Object
Properties:
Name Type Argument Default Description
path string Path to the WebViewer lib folder
annotationUser string <optional>
Guest Name of the user for annotations
config string <optional>
URL path to a custom JavaScript for customizations
css string <optional>
URL path to a custom CSS file for customizations
disabledElements Array.<string> <optional>
List of data-elements to be disabled in UI
accessibleMode boolean <optional>
false Enable accessibility features. E.g tab page selection and page text in the DOM
enableAnnotations boolean <optional>
true Enable annotations feature
enableFilePicker boolean <optional>
false Enable file picker feature
enableMeasurement boolean <optional>
false Enable measurement tools
enableRedaction boolean <optional>
false Enable redaction tool
disableVirtualDisplayMode boolean <optional>
false Disable virtual display mode for pages. The virtual display mode allows documents with many pages to be loaded efficiently in continuous scrolling mode. If disabled then single page mode will be used for documents with many pages.
extension string <optional>
Extension of the document to be loaded
filename string <optional>
The name of the file that will be used when downloading the document. The extension in the filename will be used as the document type to be loaded (e.g. myfile.docx will treat the file as docx) if no extension option is passed.
initialDoc string <optional>
URL path to a document to load on startup
isAdminUser boolean <optional>
false Set user permission to admin
isReadOnly boolean <optional>
false Set user permission to read-only
licenseKey string <optional>
License key for viewing documents. If not set then WebViewer will be in demo mode.
ui string <optional>
default Type of UI to be used. Accepts `default`|`beta`.
disableLogs boolean <optional>
false Disables console logs coming from WebViewer, including the version and build numbers
disableFlattenedAnnotations boolean <optional>
false Disables the flattened rendering of existing annotations in documents.
uiPath string <optional>
Path to UI folder to use a different UI or customized UI. Default is'./ui/index.html'.
selectAnnotationOnCreation boolean <optional>
false If true then newly added annotations will be selected automatically
highContrastMode boolean <optional>
false If true then the UI will use high constrast colours to help with accessibility.

WorkerTypes

Used to preload workers before a document has been loaded.
Properties:
Name Type Description
PDF string To preload the PDF worker object
OFFICE string To preload the Office worker object
LEGACY_OFFICE string To preload the Legacy Office worker object
CONTENT_EDIT string To preload the content edit worker object
ALL string To preload all the workers objects
Example
WebViewer({
   preloadWorker: `${WebViewer.WorkerTypes.PDF},${WebViewer.WorkerTypes.OFFICE}`
 })
 .then(function(instance) {
    ...
  });

zoomStepFactor

Set the zoom step size for zooming in/out.
Type:
  • Object
Properties:
Name Type Description
zoomStepFactor.step number zoom step size in %, should always be positive
zoomStepFactor.startZoom number zoom level that the zoom step size start to apply, should always be positive.
Example
WebViewer(...)
  .then(function(instance) {
    const documentViewer = instance.Core.documentViewer;

    // you must have a document loaded when calling this api
    documentViewer.addEventListener('documentLoaded', function() {
      instance.UI.setZoomStepFactors([
        {
          step: 50,
          startZoom: 0
        }
      ]);
    });
  });