@linkurious/ogma-annotations

Type Aliases

Annotation

Ƭ Annotation: Arrow | Text

AnnotationOptions

Ƭ AnnotationOptions: Object

Type declaration

Name	Type
handleSize	number
placeholder	string

Arrow

Ƭ Arrow: AnnotationFeature<LineString, ArrowProperties>

Bounds

Ƭ Bounds: [number, number, number, number]

Bounding box object, with the following properties:

• [0]: min x
• [1]: min y
• [2]: max x
• [3]: max y

ControllerOptions

Ƭ ControllerOptions: Object

Type declaration

Name	Type	Description
arrowHandleSize	number	Size of the arrow handle
detectMargin	number	The margin in which the Texts are detected when looking for magnet points
magnetColor	string	The color of the magnet points
magnetHandleRadius	number	Display size of the magnet point
magnetRadius	number	The radius in which arrows are attracted
maxArrowHeight	number	Maximum height of the arrow in units
minArrowHeight	number	Minimum height of the arrow in units
textHandleSize	number	Size of the text handle
textPlaceholder	string	Placeholder for the text input

Events

Ƭ Events<T>: Object

Type parameters

Name
T

Type declaration

Name	Type
add	(evt: T) => void
dragend	(evt: T) => void
dragging	(evt: T, key: "line" | "start" | "end" | "text") => void
dragstart	(evt: T) => void
hover	(evt: T) => void
remove	(evt: T) => void
select	(evt: T) => void
unhover	(evt: T) => void
unselect	(evt: T) => void
update	(evt: T) => void

Extremity

Ƭ Extremity: "none" | "arrow" | "arrow-plain" | "dot" | "halo-dot"

FeatureEvents

Ƭ FeatureEvents: Object

Type declaration

Name	Type	Description
add	(evt: Annotation) => void	-
cancelDrawing	() => void	-
dragend	(evt: Arrow | Text) => void	-
dragging	(evt: Arrow | Text, key: "line" | "start" | "end" | "text") => void	-
dragstart	(evt: Arrow | Text) => void	-
link	(evt: { arrow: Arrow ; link: Link }) => void	-
remove	(evt: Annotation) => void	-
select	(evt: Annotation) => void	-
unselect	(evt: Annotation) => void	-
update	(evt: Annotation) => void	-

Id

Ƭ Id: string | number

Link

Ƭ Link: Object

Type declaration

Name	Type	Description
arrow	Id	arrow attached to the text or node
connectionPoint	Point	On which point relative to topleft corner the arrow is tighten, in case of node, it can be deduced from the arrow itself
id	Id	id of the text the arrow is attached to
side	Side	On which end the arrow is tighten to the text
target	Id	id of the text or node the arrow is attached to
targetType	TargetType	Text or node

Point

Ƭ Point: Object

Type declaration

Name	Type
x	number
y	number

Side

Ƭ Side: "start" | "end"

Stroke

Ƭ Stroke: Object

Type declaration

Name	Type
color	string
type	"plain" | "dashed" | "none"
width	number

StrokeOptions

Ƭ StrokeOptions: Object

Type declaration

Name	Type
strokeColor?	string
strokeType?	"plain" | "dashed" | "none"
strokeWidth?	number

StrokeStyle

Ƭ StrokeStyle: Stroke

TargetType

Ƭ TargetType: "text" | "node"

Text

Ƭ Text: AnnotationFeature<Polygon, TextProperties>

Vector

Ƭ Vector: Point

Variables

EVT_ADD

• Const EVT_ADD: "add"

EVT_CANCEL_DRAWING

• Const EVT_CANCEL_DRAWING: "cancelDrawing"

EVT_DRAG

• Const EVT_DRAG: "dragging"

EVT_DRAG_END

• Const EVT_DRAG_END: "dragend"

EVT_DRAG_START

• Const EVT_DRAG_START: "dragstart"

EVT_HOVER

• Const EVT_HOVER: "hover"

EVT_LINK

• Const EVT_LINK: "link"

EVT_REMOVE

• Const EVT_REMOVE: "remove"

EVT_SELECT

• Const EVT_SELECT: "select"

EVT_UNHOVER

• Const EVT_UNHOVER: "unhover"

EVT_UNSELECT

• Const EVT_UNSELECT: "unselect"

EVT_UPDATE

• Const EVT_UPDATE: "update"

NONE

• Const NONE: -1

defaultArrowOptions

• Const defaultArrowOptions: Arrow

defaultArrowStyle

• Const defaultArrowStyle: ArrowStyles

defaultControllerOptions

• Const defaultControllerOptions: AnnotationOptions

defaultTextOptions

• Const defaultTextOptions: Text

defaultTextStyle

• Const defaultTextStyle: TextStyle

Functions

clientToContainerPosition

▸ clientToContainerPosition(evt, container?): Object

Parameters

Name	Type
evt	Object
evt.clientX	number
evt.clientY	number
container?	null | HTMLElement

Returns

Object

Name	Type
x	number
y	number

colorToRgba

▸ colorToRgba(color, alpha): string

Parameters

Name	Type
color	string
alpha	number

Returns

string

createArrow

▸ createArrow(x0?, y0?, x1?, y1?, styles?): Arrow

Parameters

Name	Type	Default value
x0	number	0
y0	number	0
x1	number	0
y1	number	0
styles	Object	undefined
styles.head?	Extremity	undefined
styles.strokeColor?	string	undefined
styles.strokeType?	"none" | "plain" | "dashed"	undefined
styles.strokeWidth?	number	undefined
styles.tail?	Extremity	undefined

Returns

Arrow

createSVGElement

▸ createSVGElement<T>(tag): T

Type parameters

Name	Type
T	extends SVGElement

Parameters

Name	Type
tag	string

Returns

T

createText

▸ createText(x?, y?, width?, height?, content?, styles?): Text

Parameters

Name	Type	Default value
x	number	0
y	number	0
width	number	100
height	number	50
content	string	""
styles	Partial<TextStyle>	undefined

Returns

Text

getAnnotationsBounds

▸ getAnnotationsBounds(annotations): Bounds

Calculate the bounds of a collection of annotations

Parameters

Name	Type
annotations	AnnotationCollection

Returns

Bounds

getArrowEnd

▸ getArrowEnd(a): Object

Parameters

Name	Type
a	Arrow

Returns

Object

Name	Type
x	number
y	number

getArrowEndPoints

▸ getArrowEndPoints(a): Object

Parameters

Name	Type
a	Arrow

Returns

Object

Name	Type
end	{ x: number ; y: number }
end.x	number
end.y	number
start	{ x: number ; y: number }
start.x	number
start.y	number

getArrowSide

▸ getArrowSide(a, side): Object

Parameters

Name	Type
a	Arrow
side	"start" | "end"

Returns

Object

Name	Type
x	number
y	number

getArrowStart

▸ getArrowStart(a): Object

Parameters

Name	Type
a	Arrow

Returns

Object

Name	Type
x	number
y	number

getAttachmentPointOnNode

▸ getAttachmentPointOnNode(start, nodeCenter, nodeRadius): Object

Parameters

Name	Type
start	Point
nodeCenter	Point
nodeRadius	number

Returns

Object

Name	Type
x	number
y	number

getHandleId

▸ getHandleId(handle): number

Parameters

Name	Type
handle	HTMLDivElement

Returns

number

getTextBbox

▸ getTextBbox(t): BBox

Parameters

Name	Type
t	Text

Returns

BBox

getTextPosition

▸ getTextPosition(t): Object

Parameters

Name	Type
t	Text

Returns

Object

Name	Type
x	number
y	number

getTextSize

▸ getTextSize(t): Object

Parameters

Name	Type
t	Text

Returns

Object

Name	Type
height	number
width	number

hexShortToLong

▸ hexShortToLong(color): string

Parameters

Name	Type
color	string

Returns

string

hexToRgba

▸ hexToRgba(color, alpha): string

Parameters

Name	Type
color	string
alpha	number

Returns

string

isAnnotationCollection

▸ isAnnotationCollection(a): a is AnnotationCollection

Parameters

Name	Type
a	AnnotationFeature<Geometry, AnnotationProps> | FeatureCollection<Geometry, GeoJsonProperties>

Returns

a is AnnotationCollection

isArrow

▸ isArrow(a): a is Arrow

Parameters

Name	Type
a	AnnotationFeature<Geometry, AnnotationProps>

Returns

a is Arrow

isText

▸ isText(a): a is Text

Parameters

Name	Type
a	AnnotationFeature<Geometry, AnnotationProps>

Returns

a is Text

rgbToRgba

▸ rgbToRgba(color, alpha): string

Parameters

Name	Type
color	string
alpha	number

Returns

string

scaleGeometry

▸ scaleGeometry(geometry, scale, ox, oy): LineString | Polygon

Parameters

Name	Type
geometry	LineString | Polygon
scale	number
ox	number
oy	number

Returns

LineString | Polygon

setArrowEnd

▸ setArrowEnd(a, x, y): void

Parameters

Name	Type
a	Arrow
x	number
y	number

Returns

void

setArrowEndPoint

▸ setArrowEndPoint(a, side, x, y): void

Parameters

Name	Type
a	Arrow
side	"start" | "end"
x	number
y	number

Returns

void

setArrowStart

▸ setArrowStart(a, x, y): void

Parameters

Name	Type
a	Arrow
x	number
y	number

Returns

void

setTextBbox

▸ setTextBbox(t, x, y, width, height): void

Parameters

Name	Type
t	Text
x	number
y	number
width	number
height	number

Returns

void

updateTextBbox

▸ updateTextBbox(t): void

Parameters

Name	Type
t	Text

Returns

void