Skip to content
Sample to demonstrate integrating WebViewer into Angular
TypeScript JavaScript CSS HTML
Branch: master
Clone or download
Latest commit 2384be8 Aug 16, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
e2e initial commit Nov 2, 2018
src Updte to WV 5.1 Jun 25, 2019
.editorconfig initial commit Nov 2, 2018
.gitignore removed license key Jun 6, 2019
CONTRIBUTING.md initial commit Nov 2, 2018
LICENSE initial commit Nov 2, 2018
README.md Update README.md Aug 15, 2019
angular.json Add script for WebViewer Jun 11, 2019
package.json Update package.json Aug 12, 2019
tsconfig.json initial commit Nov 2, 2018
tslint.json initial commit Nov 2, 2018

README.md

WebViewer - Angular sample

WebViewer is a powerful JavaScript-based PDF Library that's part of the PDFTron PDF SDK. It provides a slick out-of-the-box responsive UI that interacts with the core library to view, annotate and manipulate PDFs that can be embedded into any web project.

WebViewer UI

This repo is specifically designed for any users interested in integrating WebViewer into Angular project. This project was generated with Angular CLI version 7.0.3. See Angular - Getting Started for more information.

Initial setup

Before you begin, make sure your development environment includes Node.js.

Install

git clone https://github.com/PDFTron/webviewer-angular-sample.git
cd webviewer-angular-sample
npm install

Run

npm start

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run npm run build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

WebViewer APIs

See API documentation.

Enabling full API

PDFNetJS Full is a complete browser side PDF SDK, unlocking viewing, parsing and editing of PDF files. To enable full API, you can modify constructor in webviewer.component.ts:

 ngAfterViewInit(): void {
    this.myWebViewer = new PDFTron.WebViewer({
      path: '../lib',
      initialDoc: '../files/webviewer-demo-annotated.pdf',
      fullAPI: true
    }, this.viewer.nativeElement);
  }

You can refer to this guide for more information

Contributing

See contributing.

License

See license.

You can’t perform that action at this time.