Image overlays
With a TEI transcription linked via seeAlso, word boxes are shown. Otherwise, click a marker to advance one page.
Code example
<!-- Viewer and panel hosts in your markup -->
<div id="tify"></div>
<aside id="panel"></aside>import Tify from 'tify';
import { imageOverlaysPlugin } from '@projektemacher/tify-plugin-image-overlays';
const tify = new Tify({ container: '#tify', manifestUrl });
const plugin = await imageOverlaysPlugin(tify, {
markers: 3,
panelEl: document.querySelector('#panel'),
showAnnotations: true,
showOutlines: true,
fillColor: '#0b5fff',
fillOpacity: 0.12,
});