annotorious/annotorious

What it does — Annotorious turns any web image into one that people can mark up. "Annotation" here means adding notes, highlights, or other visual comments directly onto an image, the same way you might scribble on a printed photo. The library handles all the behind-the-scenes work: you attach it to an image element, and it gives you tools to draw, save, and respond to annotations.

How you use it — Install the package with npm, import the createImageAnnotator function, and point it at an image on your page (by its HTML id). You also import a CSS file for styling. That's the whole setup — a few lines of JavaScript gets annotation functionality running.

Key features shown in the README — You can load existing annotations from a JSON file (loadAnnotations), and you can listen for user actions like creating a new annotation via an event callback (on('createAnnotation', ...)). The example shows that when a user creates an annotation, your code can do something with it (like logging it or saving it).

Who it's for — Web developers who want to add annotation capability to their own projects without building it from scratch. The README mentions use cases like annotating a historical building photo, and positions the tool as easy to embed.

Community and support — It's open source under the BSD 3-Clause license. Users can get help through a discussion forum or file issues on the official issue tracker. The maintainer also offers paid consulting and integration services via email for teams that need dedicated help.

Where to learn more — The project website (annotorious.dev) has documentation and live demos. The README itself is minimal; it points there for deeper information.