How to save and load a custom property on an annotation?

The recommended way is to use the setCustomData function on annotations.

JavaScript

1const myCustomAttributeValue = 'some custom data';
2myAnnotation.setCustomData('myCustomAttribute', myCustomAttributeValue);

When the PDF is downloaded this data will also be embedded inside the PDF and if you re-open the PDF in WebViewer it will be accessible through the getCustomData function.

JavaScript

1const myCustomAttributeValue = myAnnotation.getCustomData('myCustomAttribute');

Alternatively you can use the setCustomSerializeHandler and setCustomDeserializeHandler APIs, however note that saving an attribute this way will only work if you load XFDF separately from the PDF. If you download the PDF the attribute will not be preserved.

JavaScript

1const { Annotations } = instance.Core.Annotations;
2
3Annotations.setCustomSerializeHandler(Annotations.Annotation, function(element, pageMatrix, options) {
4 options.originalSerialize(element, pageMatrix);
5 if (options.annotation.myCustomAttribute) {
6 element.setAttribute('attribute-name', options.annotation.myCustomAttribute);
7 }
8 return element;
9});
10
11Annotations.setCustomDeserializeHandler(Annotations.Annotation, function(element, pageMatrix, options) {
12 options.originalDeserialize(element, pageMatrix);
13 options.annotation.myCustomAttribute = element.getAttribute('attribute-name');
14});

Did you find this helpful?

Trial setup questions?

Ask experts on Discord

Need other help?

Contact Support

Pricing or product questions?

Contact Sales