Some test text!

Loading...
Guides

APIs for Cordova / Ionic PDF viewer

new NativeViewer(options, element)

Creates a NativeViewer and embeds it on the HTML page.

Parameters

options

Options passed to the NativeViewer, available options are:

  • initialDoc: string, optional - the URL path to a document to load on startup
  • l: string, optional - the PDFTron license key
  • disabledElements: array of string, optional - hides multiple elements in the viewer, see disableElements for list of available options
  • boundingRect: object, optional - the bounding box for where NativeViewer should be embedded. If no boundingRect is provided, the viewer will be presented full screen.
  • topLeftButtonTitle: string, optional - the menu item for top left navigation button, shown as icon on Android and text on iOS, available options are: menu, close, back
  • showTopLeftButton: boolean, optional - whether to show the top left navigation button
TypeRequiredDefault
objecttrueN/A

element

An html element. If an element is provided, the viewer will be added at the location specified by boundingRect. (If no boundingRect is provided, on iOS the viewer will be presented directly over the element itself, and on Android the viewer will be presented full screen.) If no element is provided, the API showDocumentViewer() must be used to show the viewer.

TypeRequiredDefault
stringfalseN/A

Example

var viewerElement = document.getElementById('viewer');
var rect = viewerElement.getBoundingClientRect();
var viewer = new PDFTron.NativeViewer({
    l: '<your-key-here>',
    initialDoc: 'https://pdftron.s3.amazonaws.com/downloads/pl/PDFTRON_mobile_about.pdf',
    boundingRect: { left: rect.left, top: rect.top, width: rect.width, height: rect.height },
    disabledElements: [
    // hide elements as you wish
    ]
}, viewerElement);

disableElements(dataElements)

Hides multiple elements in the viewer, available options are:

  • viewControlsButton
  • freeHandToolButton
  • highlightToolButton
  • underlineToolButton
  • squigglyToolButton
  • strikeoutToolButton
  • rectangleToolButton
  • ellipseToolButton
  • lineToolButton
  • arrowToolButton
  • polylineToolButton
  • polygonToolButton
  • cloudToolButton
  • signatureToolButton
  • freeTextToolButton
  • stickyToolButton
  • calloutToolButton
  • stampToolButton
  • toolsButton
  • searchButton
  • shareButton
  • thumbnailsButton
  • listsButton
  • thumbnailSlider

Parameters

Example

// remove search button and line create tool
this.viewer.disableElements([ 'searchButton', 'lineToolButton' ]);

disableTools(toolNames)

Disable multiple tools.

Parameters

toolNames

Array of name of the tools, available options are:

  • AnnotationEdit
  • TextSelect
  • AnnotationCreateSticky
  • AnnotationCreateFreeHand
  • AnnotationCreateTextHighlight
  • AnnotationCreateTextUnderline
  • AnnotationCreateTextSquiggly
  • AnnotationCreateTextStrikeout
  • AnnotationCreateFreeText
  • AnnotationCreateCallout
  • AnnotationCreateSignature
  • AnnotationCreateLine
  • AnnotationCreateArrow
  • AnnotationCreatePolyline
  • AnnotationCreateStamp
  • AnnotationCreateRectangle
  • AnnotationCreateEllipse
  • AnnotationCreatePolygon
  • AnnotationCreatePolygonCloud
  • AnnotationCreateDistanceMeasurement
  • AnnotationCreatePerimeterMeasurement
  • AnnotationCreateAreaMeasurement
TypeRequiredDefault
array of stringfalseall tools

Example

// enable sticky annotation tool and free text tool
this.viewer.disableTools([ 'AnnotationCreateSticky', 'AnnotationCreateFreeText' ]);

enableTools(toolNames)

Enable multiple tools that were previously disabled.

Parameters

toolNames

Array of name of the tools, available options are:

  • AnnotationEdit
  • TextSelect
  • AnnotationCreateSticky
  • AnnotationCreateFreeHand
  • AnnotationCreateTextHighlight
  • AnnotationCreateTextUnderline
  • AnnotationCreateTextSquiggly
  • AnnotationCreateTextStrikeout
  • AnnotationCreateFreeText
  • AnnotationCreateCallout
  • AnnotationCreateSignature
  • AnnotationCreateLine
  • AnnotationCreateArrow
  • AnnotationCreatePolyline
  • AnnotationCreateStamp
  • AnnotationCreateRectangle
  • AnnotationCreateEllipse
  • AnnotationCreatePolygon
  • AnnotationCreatePolygonCloud
  • AnnotationCreateDistanceMeasurement
  • AnnotationCreatePerimeterMeasurement
  • AnnotationCreateAreaMeasurement
TypeRequiredDefault
array of stringfalseall tools

Example

// enable sticky annotation tool and free text tool
this.viewer.disableElements([ 'AnnotationCreateSticky', 'AnnotationCreateFreeText' ]);

setToolMode(toolName)

Sets tool mode.

Parameters

toolName

Name of the tool, available options are:

  • AnnotationEdit
  • TextSelect
  • AnnotationCreateSticky
  • AnnotationCreateFreeHand
  • AnnotationCreateTextHighlight
  • AnnotationCreateTextUnderline
  • AnnotationCreateTextSquiggly
  • AnnotationCreateTextStrikeout
  • AnnotationCreateFreeText
  • AnnotationCreateCallout
  • AnnotationCreateSignature
  • AnnotationCreateLine
  • AnnotationCreateArrow
  • AnnotationCreatePolyline
  • AnnotationCreateStamp
  • AnnotationCreateRectangle
  • AnnotationCreateEllipse
  • AnnotationCreatePolygon
  • AnnotationCreatePolygonCloud
  • AnnotationCreateDistanceMeasurement
  • AnnotationCreatePerimeterMeasurement
  • AnnotationCreateAreaMeasurement
TypeRequiredDefault
stringtrueN/A

Example

// sets the current tool mode to freehand inking
this.viewer.setToolMode('AnnotationCreateFreeHand');

loadDocument(documentPath)

Load a document inside NativeViewer UI.

Parameters

Example

this.viewer.loadDocument('https://pdftron.s3.amazonaws.com/downloads/pl/PDFTRON_mobile_about.pdf');

showDocumentViewer()

Shows a previously constructed NativeViewer.

If a boundingRect is defined, the viewer will be displayed on top of the web content within the specified rect. If no boundingRect is defined, the viewer will be presented full screen.

Example

this.viewer.showDocumentViewer();

Get the answers you need: Support