Component annotated text

This repository contains a reusable Javascript component to visualize text annotations on web pages. It can be used for linguistic analysis, text structure or other annotations on unicode text. It is best explained by the following screenshots:

Following text formats are supported:

• Plain text

• Text divided in lines

• Markdown text

  or Create your own text adapter

Following annotation formats are supported:

• W3C Web Annotation format

• Custom annotation format

  or Create your own annotation adapter

Usage

Documentation

To build the docs run pnpm run docs:build or access Github Docs

Creating a new release

Documentation on releases can be found on: Release documentation

Minimal working example

More Information in the Getting started documentation

@use '@ghentcdh/annotated-text/style.css' as *;

<div :id="id"></div>

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

const id = `annotated-text-{uuid}`;

const textAnnotation = createAnnotatedText(id)
  .setText(text)
  .setAnnotations(annotations);

Credits

Built @ the Ghent Center For Digital Humanities, Ghent University by:

• Pieterjan De Potter
• Frederic Lamsens
• Joren Six
• Jahid Chetti
• Bo Vandersteene