Guides

Import & Export Annotations in PDF

This sample shows how to set up the export and import of annotations. The document from which the annotations are exported is an xfdf file

javascript

// Import the JS file of ComPDFKit Web Demo.
import ComPDFKitViewer from "/@compdfkit/webviewer";

const viewer = document.getElementById('webviewer');
ComPDFKitViewer.init({
  pdfUrl: 'Your PDF Url',
  license: 'Input your license here'
}, viewer)
.then((core) => {
  const docViewer = core.docViewer;
  docViewer.addEvent('documentloaded', () => {
    console.log('ComPDFKit Web Demo loaded');

    // Sample1: Export Annotation
    if (ExportAnnotaiton(docViewer)) {
      console.log('Export annotaiton done.');
    } else {
      console.log('Export annotaiton failed.');
    }

    // Sample2: Import Annotations
    ImportAnnotaiton(docViewer);
  })
})

// Export the annotations in the document to XFDF format.
function ExportAnnotaiton(docViewer) {
  if (!docViewer.exportXfdf()) {
    return false;
  }
  return true;
}

// Importing XFDF into the document.
async function ImportAnnotaiton(docViewer) {
  const response = await fetch('test.xfdf');
  const xfdfString = await response.text();
  docViewer.importAnnotations(xfdfString);
}

Import & Export Annotations in PDF ​

Import & Export Annotations in PDF