React component for interactive blended text marking
npm install react-text-annotate-blendThis component allows for text annotation with overlapping start and end positions. The overlap is resolved as a _blend_ of the two tag colors to visually indicate the overlap.
TextAnnotateBlend only supports a single overlap of annotations at a given position.
``js
const value = [
{
start: 5,
end: 29,
tag: "tagA",
color: "rgb(179, 245, 66)"
},
{
start: 24,
end: 41,
tag: "tagB",
color: "#42f5f5"
}
]
value={value}
/>
`
TextAnnotate is a simple text annotation component bound to start and end positioning. Overlapping components is not supported.
This component extends and cleans up the TextAnnotator component from react-text-annotate.
`js
const value = [
{
start: 0,
end: 14,
tag: "tagA",
color: "rgb(179, 245, 66)",
},
{
start: 24,
end: 41,
tag: "tagB",
color: "#42f5f5",
},
]
value={value}
/>
``