Did you find this guide helpful?
Some test text!
Web / Guides / Image to PDF
Platform
Documentation
Convert TIFF, BMP, PNG, JPG to PDF using WebViewer SDK in the browser without server-side dependencies.
WebViewer supports loading images by default using initialDoc, or loadDocument API. After loading the document, you can get the document and save it as a PDF or download it.
Load the image with the WebViewer constructor and it will load with the Viewer.
WebViewer({
...,
initialDoc: 'https://myserver.com/myfile.png',
}, document.getElementById('viewer'));Display & view documents using JavaScript
Full sample code shows how to call WebViewer constructor to instantiate and load document. You can load local/remote files of your choice.
Load the image with the load document method after WebViewer is initalized.
WebViewer(...)
.then(instance => {
instance.UI.loadDocument('https://myserver.com/myfile.png', { filename: 'myfile.png' });
});Display & view documents using JavaScript
Full sample code shows how to call WebViewer constructor to instantiate and load document. You can load local/remote files of your choice.
WebViewer allows loading TIFF, TIF files in the sample below.
Webviewer({
fullAPI: true,
}, viewerRef).then((instance) => {
const { Core, UI } = instance;
const { PDFNet } = Core;
await PDFNet.initialize();
await PDFNet.runWithoutCleanup(async () => {
const doc = await PDFNet.PDFDoc.create();
doc.initSecurityHandler();
doc.lock();
const tiffFile = await PDFNet.Filter.createURLFilter("./files/test.tif");
await PDFNet.Convert.fromTiff(doc, tiffFile);
doc.unlock();
UI.loadDocument(doc);
});
});This code sample demonstrates how to convert PDF to image without initializing WebViewer UI.
<html>
<body>
<script src="../lib/core/webviewer-core.min.js"></script>
<script src="../lib/core/PDFNet.js"></script>
<script>
(async function() {
Core.setWorkerPath('../lib/core');
const doc = await Core.createDocument('https://myserver.com/myfile.png', { filename: 'myfile.png' });
const data = await doc.getFileData();
const arr = new Uint8Array(data);
const blob = new Blob([arr], { type: 'application/pdf' });
})()
</script>
</body>
</html>Get the answers you need: Support