How emigre/openseadragon-annotations works
OpenSeadragon Annotations adds an SVG drawing layer and draw/move controls to a deep-zoom viewer. The workflow starts when the viewer opens: the plugin mounts the overlay, initializes drawing state and controls, then routes pointer actions through a Flux dispatcher to update annotations. The overlay renders that state over the image; callers can also get, set, or clear annotations. The map reflects the sampled source and README; no persistence layer is documented.
Main entry points: main.js Annotations plugin · createModel.js Annotation model · Overlay.js SVG overlay · createDispatcher.js Action dispatcher
Components 8
Viewer integration
- Annotations plugin
src/main.js
Drawing interaction
- SVG overlay
src/views/Overlay.js - Draw/move controls
src/views/Controls.js
Annotation state
- Action dispatcher
src/model/createDispatcher.js - Action reactions
src/model/generalActions.js - Annotation model
src/model/createModel.js
Other components
- Viewer user
- OpenSeadragon viewer
Connections 14
- Viewer user → OpenSeadragon viewer: uses
README.md - OpenSeadragon viewer → Annotations plugin: opens, zooms
src/main.js - Annotations plugin → OpenSeadragon viewer: registers handlers
src/main.js - Annotations plugin → Annotation model: creates
src/main.js - Annotations plugin → Action dispatcher: configures
src/main.js - Annotations plugin → SVG overlay: mounts
src/main.js - Annotations plugin → Draw/move controls: creates
src/main.js - Action dispatcher → Action reactions: registers
src/model/createDispatcher.js - Action reactions → Annotation model: updates
src/model/generalActions.js - SVG overlay → Action dispatcher: dispatches pointer actions
src/views/Overlay.js - Draw/move controls → Action dispatcher: dispatches mode changes
src/views/Controls.js - SVG overlay → Annotation model: subscribes to changes
src/views/Overlay.js - SVG overlay → Annotation model: renders annotations
src/views/Overlay.js - Annotations plugin → Annotation model: gets or resets annotations
src/main.js