δΈ­ζ–‡ | English

🎨 Image Annotation Drawer

A lightweight, dependency-free image annotation library for the web

Select annotation, double-click to quick-edit. Placeholder changes only affect annotations titled afterwards.

πŸ“– Instructions

  • Draw RectangleClick & Drag
  • Draw PolygonClick points, Double-click to finish
  • Add TextClick to place
  • Edit TitleDouble-click annotation
  • Select/MoveClick annotation
  • Pan ImageDrag mode
  • ZoomMouse wheel

⌨️ Keyboard Shortcuts

  • Reset ViewSpace
  • Cancel/DeselectESC
  • Delete SelectedDelete
  • Undo DeleteCtrl+Z

πŸ“š API Quick Reference

  • drawer.setDrawType(type)
  • drawer.drawImage(url)
  • drawer.setAnnotationTitle(idx, title)
  • drawer.getAnnotationTitle(idx)
  • drawer.getAnnotations()
  • drawer.exportAnnotationImage()
  • drawer.clearAnnotations()
  • drawer.withdraw()

πŸ”— Links

  • GitHub Repository
  • npm Package
  • δΈ­ζ–‡ζΌ”η€Ί