Lightweight PDF viewer using Mozila's PDF JS.
Make sure dist/index.html(and JS/CSS resources it needed) is served by your own static server.
You can clone our project, run command python -m simpleHTTPServer to start a simple static server to serve these files.
- Include
src/pdfviewer.jsin your html file:
<head>
...
<script src="pdfviewer/dist/pdfviewer.js"></script>
...
</head>
<body>
...
<div id="container"></div>
...
</body>- Once you include
pdfviewer.js, you have aPdfViewerobject, it takes a plain object as argument, and then you canembedit to your document,#containerin this case:
new PdfViewer({pdfUrl: 'path/to/your/file', staticHost: 'path/to/your/static/host'}).embed(document.getElementById('container'))note: The container you are going to embed to must be in the DOM tree already when you do the embed action.
The options PdfViewer accepts are:
-
pdfUrl(required): URL to your pdf file, can be relative or absolute. If it is a cross-domain path, the remote server must support CORS.
-
staticHost(required): Static files host, PdfViewer dependents on Mozila's
PDF.jsand ourviewer.js, which must be served. -
onerror(optional): A custom
onerrorcallback function, if error occurs when reading or rendering your pdf file, this function will be called. If omitted, our viewer's default error handler will be used.
Follow these steps to get a demo:
- Run command:
python -m simpleHTTPServer- Go to your browser and open:
http://localhost:8000/examples/index.html
- Teambition: https://www.teambition.com/