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

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

const viewer = document.getElementById('webviewer');
ComPDFKitViewer({
  path: '/',
  initialDoc: 'Your PDF Url',
  licenseKey: 'Input your license here'
}, viewer)
.then((instance) => {
  const { documentViewer } = instance.Core;
  documentViewer.addEventListener('documentLoaded', async () => {
    console.log('ComPDFKit Web Demo loaded');

    // Sample1: Export Annotations
    if (await ExportAnnotation(instance.Core)) {
      console.log('Export annotaitons done.');
    } else {
      console.log('Export annotaitons failed.');
    }

    // Sample2: Import Annotations
    ImportAnnotaiton(instance.Core);
  })
})

// Export annotations in the document to XFDF format.
async function ExportAnnotation({ annotationManager }) {
  /**
   * Exports annotations in the document to an XFDF string.
   *
   * @returns {Promise<string>} The XFDF string.
   */
  const xfdfString = await annotationManager.exportAnnotations();
  if (!xfdfString) {
    return false;
  }
  return true;
}

// Importing XFDF into the document.
async function ImportAnnotaiton({ annotationManager }) {
  const file = await fetch('test.xfdf');
  await annotationManager.importAnnotations(await file.blob());
}