Web annotation Data Model

W3C annotation formats are used to create annotations that can be shared and reused across different platforms and applications. They are based on the W3C Web Annotation Data Model and can be used to annotate text, images, and other resources.

More information can be found in the W3C Web Annotation Data Model specification.

Info

W3C text annotations are partially implemented, check the documentation for implementation details.

Quick start

The W3C annotation should at least have an id, motivation, and a target. The target should contain the selection.

{
  "id": "ann-1",
  "motivation": "tagging",
  "@context": "http://www.w3.org/ns/anno.jsonld",
  "target": [
    {
      "type": "Text",
      "selector": {
        "start": 228,
        "end": 488,
        "type": "TextPositionSelector"
      }
    }
  ]
}

Pass the W3CAnnotationAdapter when creating the AnnotatedText component.

Then add annotations with the setAnnotations method.

import { createAnnotatedText, W3CAnnotationAdapter } from "@ghentcdh/annotated-text";

createAnnotatedText(id, { annotationAdapter: W3CAnnotationAdapter() })
  .setText(w3cText.text, false)
  .setAnnotations(w3cText.w3cAnnotations.items)

Example

Example with multiple sources

Sometimes you might have annotations from different sources. In that case, you can specify the source ID when initializing the parser.

W3CAnnotationAdapter({
  sourceId: `https://example.com/source1`
})