DEV Community

Cover image for PDF.js annotation library in pure JavaScript. Create and save PDF annotation, (pdf highlight/signature)- pdf.js
Chaoxu Wei
Chaoxu Wei

Posted on

1

PDF.js annotation library in pure JavaScript. Create and save PDF annotation, (pdf highlight/signature)- pdf.js

Demo and Source code

Demo and source code: https://demos.libertynlp.com
the best solution of pdf.js annotation, only use pdf.js-dist, support old browser, smart phone and mobile device, very easy to import into your project.
Image description

Function

① download : save pdf with annotations mark
② highlight : highlight selected text;
③ underline : underline selected text;
④ screenshot: screenshot pdf save as png;
⑤ polygon: add textbox/arrow/rectangle/circle;
⑥ free draw: free draw and auto smooth;
⑦ image: insert image (forexample signature);
⑧ edit: edit annotation ( copy/delete/add comment/navigate );
⑨ output annotations : output annotations for importing;
⑩ import annotations : import annotations for current file;
⑪ download txt : download annotations and comments text;
⑫ clear: clear one/page/file annotation;
⑬ undo annotations : undo annotations in current page;
⑭ help : open help file;

Demonstrate Video

Youtube tutorial video:

Summarize

I have figureed out the best solution of pdf.js annotation using only pdf.js-dist, and I put the live demo and source code in https://demos.libertynlp.com

Waiting for your visiting and using.

Top comments (0)

Gen AI apps are built with MongoDB Atlas

Gen AI apps are built with MongoDB Atlas

MongoDB Atlas is the developer-friendly database for building, scaling, and running gen AI & LLM apps—no separate vector DB needed. Enjoy native vector search, 115+ regions, and flexible document modeling. Build AI faster, all in one place.

Start Free

👋 Kindness is contagious

Discover fresh viewpoints in this insightful post, supported by our vibrant DEV Community. Every developer’s experience matters—add your thoughts and help us grow together.

A simple “thank you” can uplift the author and spark new discussions—leave yours below!

On DEV, knowledge-sharing connects us and drives innovation. Found this useful? A quick note of appreciation makes a real impact.

Okay