arraysize: 0

Mirador with the Annotations plugin

The extension comes with the Annotations plugin, which can be enabled together with the localStorage adapter. The plugin "adds annotation creation tools to the user interface. Users can create rectangle, oval, and polygon annotations and add text descriptors." To play with it yourself, you can use this demo. The addition of this plugin is part of a little project to see how MediaWiki could function as an 'annotation server'.

Enable the plugin

The Annotations plugin can be enabled by setting the annotationsenabled parameter to true.


Save localStorage data to the wiki

The approach is quite straightforward: JavaScript is available from the extension to let the user (or some script) click a button and import the JSON string of any relevant annotations that are in localStorage into a textarea field. The imported JSON content can then be saved to a wiki page.

  • Requires the presence of two HTML elements:
    • (a) a button with id = storage-annotations-textarea-button, which you can generate through a parser function,
      {{#mirador-annot:action=print }}
    • (b) a textarea with id = storage-annotations-textarea. Requires a form extension like FlexForm.
  • It may be helpful to set up a namespace whose content model is JSON by default.

Manage localStorage data

Clear annotations from localStorage

Use this parser function to clear those annotations in localStorage that relate to (canvas IDs of) the present manifest.


Import annotations into localStorage

We have seen how we saved annotation JSON to a wiki page. What if you, or anyone else on the wiki, wanted to continue by importing those annotations to one's localStorage? This parser function outputs a button that lets you do so. Use pageid to select the page ID of the wiki page containing the annotation JSON.


|label=Add saved annotations to local storage 

Present annotations

See Lab/IIIF/Annotations.


  • Some of the naming decisions (on my part) may change.
  • Consider whether sessionStorage is to be preferred over localStorage.
  • Compared to something like Leaflet's annotation plugin for GeoJson, the Mirador plugin feels a little more cumbersome.
  • You may have a hard time detecting the lines around a shape, or they may appear too thick. Line width happens to be proportionate to the zoom level. When zooming out you may struggle to locate them and conversely, when zooming in on a canvas, you may find them obtrusive.
  • An interesting use case would be a way of collective annotation where students/audience members would start on their own and when time is up, all annotations would be gathered and presented together on the screen (no concrete ideas here).
    • This specific kind of merging annotations is not yet supported. You would potentially end up with number of AnnotationPage instances sharing the same identifiers but with different content, but it does not look impossible.
    • Metadata such as attributions and timestamps are not yet supported (although a fork is being created which focuses on matters such as authorship attribution).

Additional data

Apart from some of the graphic possibilities, the annotations themselves remain basic and text-based. The plugin does not offer anything in the way of extending the form to support linked data and associated form features such as autocompletion. For CODECS this means that its usefulness is quite limited, although there are possibilities I haven't explored or found the right use/context for.

In order for something like this to accept additional input, the Annotation model must support it. Or rather models, because we now need to deal with both Open Annotations (IIIF v2) and W3C Web Annotations (IIIF v3). How much room there would be for rich, structured annotations is unclear to me atm, but the following may be within scope:

  • tags: probably still rudimentary but essential
  • motivations: relatively unimportant but can be used to distinguish between e.g. transcriptions, descriptions and comments. There many possible motivations and multiple ones may be valid at the same time.
  • authorial attributions: i.e. who created the annotation.
  • timestamps? Relatively unimportant here.

Update. Tagging appears to have been a feature of the previous plugin for Mirador 2, but for some reason, it was wanting from the successor created for Mirador 3. The feature was requested and it does look like relevant code was submitted as far back as 2020, but nothing came of it. Unfortunately, it is possible that further work on plugins like this one will to have wait until Mirador has been upgraded to be fully compatible with React 18.