Importing and exporting annotations with Document Engine

When you use Nutrient Web SDK with Document Engine, all of a document’s annotations are imported from Document Engine when you open it. When you create new annotations or update existing annotations through the UI or the API, the changes are exported to Document Engine as well. This process is transparent to you and your users. You can control when the annotations are saved by changing the auto-save mode.

With Instant, changes made to annotations are automatically synchronized across all connected users, enabling real-time collaboration capabilities in your application.

Importing and exporting annotations in Instant JSON with Document Engine

You can import and export annotations (including custom rendered annotations) from and to documents opened from Document Engine in the Instant JSON format.

To import annotations in the Instant JSON format into the currently open document, use the NutrientViewer.Instance.applyOperations API, as demonstrated in the following code snippet. The instantJson variable in the code below is an Instant JSON object — for example, the result of parsing a JSON string with JSON.parse(opens in a new tab):

await instance.applyOperations([
  { type: "applyInstantJson", instantJson: instantJson }
]);

To export annotations, use the NutrientViewer.Instance.exportInstantJSON method. For example, to print an opened document’s Instant JSON to the console, use the following code snippet:

const instantJSON = await instance.exportInstantJSON();
console.log(instantJSON);

Importing and exporting annotations in XFDF with Document Engine

You can also import and export annotations (including custom rendered annotations) from and to documents opened from Document Engine in the XFDF format.

To import annotations as XFDF into the currently open document, use the NutrientViewer.Instance.applyOperations API, as demonstrated in the following code snippet. The xfdf variable in the code below is an XFDF string:

await instance.applyOperations([
  { type: "applyXfdf", xfdf: xfdf }
]);

To export annotations, use the NutrientViewer.Instance.exportXFDF method. For example, to print the opened document’s XFDF file to the console, use the following code snippet:

const xfdf = await instance.exportXFDF();
console.log(xfdf);