Foxit PDF SDK for Web

How to Create Image Annotations with Foxit PDF SDK for Web

The image annotation feature allows you to add graphic annotations to PDF files, perfect for situations when text annotations don’t suffice.

Foxit PDF SDK for Web allows you to use this feature by adding the simple code below:

var obj = {
 type: "screen",
 rect: {
 left:60,
 right:160,
 top:470,
 bottom:370
 }
}; 
var url = 'http://localhost:8780/docs/test.png';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'arraybuffer';
xhr.send();
xhr.onload = function(e) {
 if(xhr.readyState == 4){
 var responseArray = new Uint8Array(this.response);
 console.log(responseArray);
 obj.buffer=responseArray;
 pdfui.getCurrentPDFDoc().then((pdfdoc) => {
 pdfdoc.getPageByIndex(0).then((page) => {
 page.addAnnot(obj);
 });
 }) 
 }
}

Updated on August 21, 2019

Was this article helpful?
Thanks for your feedback. If you have a comment on how to improve the article, you can write it here: