DiagramTooltipModel API in Vue Diagram API component

Interface for a class DiagramTooltip

Properties

animation

AnimationModel

Allows to set the same or different animation option for the Tooltip, when it is opened or closed.

<div id='diagram'></div>

let diagram: Diagram = new Diagram({
...
constraints: DiagramConstraints.Default | DiagramConstraints.Tooltip,
tooltip: { content: getcontent(), position: 'TopLeft', relativeMode: 'Object',
animation: { open: { effect: 'FadeZoomIn', delay: 0 },
close: { effect: 'FadeZoomOut', delay: 0 } } },
...
});
diagram.appendTo('#diagram');
function getcontent(): => {
...
}

content

string | HTMLElement

Defines the content of the Tooltip

height

number | string

Sets the height of the Tooltip

isSticky

boolean

Specifies whether the tooltip remains visible even when the mouse moves away from the target element. If set to true, the tooltip is always visible; otherwise, it is hidden when the mouse moves away. The default value is false.

openOn

TooltipMode

Sets how to open the Tooltip

position

Position

Defines the position of the Tooltip

relativeMode

TooltipRelativeMode

Defines the relative mode of the Tooltip

• Object - sets the tooltip position relative to the node
• Mouse - sets the tooltip position relative to the mouse

showTipPointer

boolean

Defines if the Tooltip has tip pointer or not

width

number | string

Sets the width of the Tooltip