annotorious-freehand-redraw
v0.1.1
Published
Freely redraw a part of the annotation boundary (extension to the freehand drawing tool provided by Annotorious and the Annotorious OpenSeadragon plugin)
Downloads
6
Readme
Addition to the original annotorious selector pack
Freely redraw a part of the annotation boundary.
Rationale. Pathologists find being able to redraw part of the annotation boundary useful.
How to use? Grab any handle on the boundary and redraw a new path ending at a point on the boundary. The part between the start point and the endpoint will disappear after mouseup. This package is an extension to the original Freehand drawing tool made by Rainer Simon and his collaborators.
Annotorious Selector Pack
Additional selection tools for Annotorious and the Annotorious OpenSeadragon plugin.
- Circle
- Ellipse
- Freehand
Using
Include the plugin in your page directl from the CDN:
<html>
<head>
<!-- Annotorious first -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@recogito/annotorious@latest/dist/annotorious.min.css">
<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious@latest/dist/annotorious.min.js"></script>
<!-- Tilted box plugin -->
<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-selector-pack@latest/dist/annotorious-selector-pack.min.js"></script>
</head>
<body>
<img id="hallstatt" src="640px-Hallstatt.jpg">
<script>
window.onload = function() {
// Init Annotorious
var anno = Annotorious.init({
image: 'hallstatt'
});
// Init the plugin
Annotorious.SelectorPack(anno);
// [ 'rect', 'polygon', 'circle', 'ellipse', 'freehand' ]
console.log(anno.listDrawingTools());
anno.setDrawingTool('ellipse');
}
</script>
</body>
</html>
Development
To run in development mode:
$ npm install
$ npm start