An IInputMode that detects when the mouse hovers over the CanvasComponent.
Remarks
This implementation will show a ToolTip. In order to make use of this instance one has to register with the QueryToolTip event. Setting a custom validHoverLocationHitTestable will restrict the area where a tooltip can be shown.
This mode is exclusive by default.
Examples
Typically the MouseHoverInputMode is installed as child mode of a GraphEditorInputMode or GraphViewerInputMode and can be retrieved from the mouseHoverInputMode property.
const mouseHoverInputMode = mode.mouseHoverInputModeIt is recommended to configure the tooltip handling on the parent GraphEditorInputMode or GraphViewerInputMode instead of the MouseHoverInputMode. This involves registering for the QueryItemToolTip event instead of the QueryToolTip event:
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.toolTipItems = GraphItemTypes.NODE
// register a listener
mode.addQueryItemToolTipListener((src, args) => {
if (args.handled) {
// A tooltip has already been assigned -> nothing to do.
return
}
// We can safely cast here because we set ToolTipItems to only Node.
const hitNode = args.item
if (hitNode.labels.size > 0) {
// Show the text of the first label as tooltip.
args.toolTip = hitNode.labels.get(0).text
// Indicate that the tooltip content has been set.
args.handled = true
}
})// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.toolTipItems = GraphItemTypes.NODE
// register a listener
mode.addQueryItemToolTipListener((src, args) => {
if (args.handled) {
// A tooltip has already been assigned -> nothing to do.
return
}
// We can safely cast here because we set ToolTipItems to only Node.
const hitNode = args.item as INode
if (hitNode.labels.size > 0) {
// Show the text of the first label as tooltip.
args.toolTip = hitNode.labels.get(0).text
// Indicate that the tooltip content has been set.
args.handled = true
}
})Type Details
- yfiles module
- view-component
- yfiles-umd modules
- All view modules
- Legacy UMD name
- yfiles.input.MouseHoverInputMode
See Also
Constructors
Creates a new instance using the provided optional text provider.
Parameters
A map of options to pass to the method.
- textProvider - function(Object, ToolTipQueryEventArgs):void
Signature Details
function(sender: this, evt: ToolTipQueryEventArgs)Represents the method that will handle an event when the event provides data.Parameters
- sender - this
- The source of the event.
- evt - ToolTipQueryEventArgs
- An object that contains the event data.
- priority - number
- exclusive - boolean
A value indicating whether this mode will be the only one running when it has the mutex. This option sets the exclusive property on the created object.
- enabled - boolean
The enabled state of this input mode. This option sets the enabled property on the created object.
- validHoverLocationHitTestable - IHitTestable
An IHitTestable that determines where the mouse may hover and a tooltip can be shown. This option sets the validHoverLocationHitTestable property on the created object.
- validHoverLocationCursor - Cursor
The cursor to use when the mouse is at a valid hover location. This option sets the validHoverLocationCursor property on the created object.
- toolTipLocationOffset - Point
The tooltip location offset in view coordinates. This option sets the toolTipLocationOffset property on the created object.
- toolTipParentElement - HTMLElement
A custom parent element to which the tooltip is added as child in the DOM. This option sets the toolTipParentElement property on the created object.
- duration - TimeSpan
The duration to show the tooltip. This option sets the duration property on the created object.
- delay - TimeSpan
The duration the mouse has to hover in one place to show a tooltip. This option sets the delay property on the created object.
- mouseHoverSize - Size
The amount the mouse pointer has to move in order to hide the tooltip. This option sets the mouseHoverSize property on the created object.
- closeOnClick - boolean
Whether the tooltip is closed when the a click is performed over the tooltip. This option sets the closeOnClick property on the created object.
Properties
Gets the installed controller.
Gets or sets the duration the mouse has to hover in one place to show a tooltip.
Remarks
Gets or sets the duration to show the tooltip.
Remarks
Gets or sets the enabled state of this input mode.
Remarks
Gets or sets a value indicating whether this mode will be the only one running when it has the mutex.
Remarks
The value of this property will be delegated to the exclusive property of the controller.
If this mode is marked as exclusive and has the mutex, all other modes added to the same MultiplexingInputMode will be deactivated. Otherwise it will always run concurrently with all other modes.
Gets the context instance this mode is currently installed in or null if this instance is not installed.
Remarks
Implements
Gets or sets the amount the mouse pointer has to move in order to hide the tooltip.
Remarks
(10, 10).Gets the priority of this input mode.
Remarks
See Also
Implements
Gets or sets the tooltip location offset in view coordinates.
Remarks
Examples
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.mouseHoverInputMode.toolTipLocationOffset = new Point(20, 20)See Also
Gets or sets a custom parent element to which the tooltip is added as child in the DOM.
Remarks
By default this property is null, which means that the tooltip is added to the document.body.
When specifying some other element as parent, it must be assured that the element is currently visible (i.e. has no style with property display: none).
Gets or sets the cursor to use when the mouse is at a valid hover location.
Remarks
nullGets or sets an IHitTestable that determines where the mouse may hover and a tooltip can be shown.
Methods
Adjust the calculated tooltip position.
Remarks
Parameters
A map of options to pass to the method.
- originalPosition - Point
- The calculated tooltip position relative to the document root
Returns
- ↪Point
- The adjusted tooltip location relative to the document root
See Also
Called by the client to unconditionally cancel all editing.
Remarks
This will be called prior to the uninstalling of this instance.
In order to stop an active input mode manually, client code should use the following idiom:
if (!mode.tryStop()) {
mode.cancel()
}Implements
Creates an IInputModeContext for use with the QueryToolTip event for the upcoming text query operation.
Returns
- ↪IInputModeContext
- An instance of IInputModeContext.
Finds the position in canvas view coordinates to display the tooltip at for the given world coordinates.
Remarks
Parameters
A map of options to pass to the method.
- location - Point
- The position in world coordinates.
Returns
- ↪Point
- The position in view coordinates.
See Also
Installs this mode into the given context that is provided by the canvas.
Remarks
In general a mode can only be installed into a single canvas at all times.
This method is called to initialize this instance. Subclasses should override this method to register the corresponding event handler delegates for the various input events they need to register with.
Overriding implementations should call the base implementation, first.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The context that this instance shall be installed into. The same instance will be passed to this instance during uninstall. A reference to the context may be kept and queried during the time the mode is installed.
- controller - ConcurrencyController
- The controller for this mode.
See Also
Implements
Called after cancel has been called.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been canceled.
This implementation does nothing.
Called after the active property of the installed ConcurrencyController has been set to true.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been activated.
Overriding implementations should call the base implementation.
Called after the active property of the installed ConcurrencyController has been set to false.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been deactivated.
Overriding implementations should call the base implementation.
Raises the QueryToolTip event.
Parameters
A map of options to pass to the method.
- evt - ToolTipQueryEventArgs
- The ToolTipQueryEventArgs instance containing the event data.
See Also
Triggered when the mouse hovers over the given coordinates.
Remarks
content is null, this method will call getToolTipContent to query the content. If there is any content it will display the toolTip at the location returned by getToolTipLocation.Returns
Called after tryStop has been called.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been stopped.
This implementation does nothing.
Shows the tooltip at the given location.
Parameters
A map of options to pass to the method.
- location - Point
- The location in the world coordinate system.
- content - Object
- The content of the tooltip. If
null, getToolTipContent will be called to get the content.
Returns
Overridden to only return true if this instance does not currently have the input mutex.
Uninstalls this mode from the given context.
Remarks
This code should clean up all changes made to the canvas in the install method. After a mode has been uninstalled it can be installed again into the same or another canvas.
Overriding implementations should call the base implementation after their own code.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The context to deregister from. This is the same instance that had been passed to install during installation.
Implements
Events
Occurs when this mode queries the tooltip for a certain query location.
Remarks
Examples
MouseHoverInputMode. This involves registering for the QueryItemToolTip event instead of this event:// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.toolTipItems = GraphItemTypes.NODE
// register a listener
mode.addQueryItemToolTipListener((src, args) => {
if (args.handled) {
// A tooltip has already been assigned -> nothing to do.
return
}
// We can safely cast here because we set ToolTipItems to only Node.
const hitNode = args.item
if (hitNode.labels.size > 0) {
// Show the text of the first label as tooltip.
args.toolTip = hitNode.labels.get(0).text
// Indicate that the tooltip content has been set.
args.handled = true
}
})// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.toolTipItems = GraphItemTypes.NODE
// register a listener
mode.addQueryItemToolTipListener((src, args) => {
if (args.handled) {
// A tooltip has already been assigned -> nothing to do.
return
}
// We can safely cast here because we set ToolTipItems to only Node.
const hitNode = args.item as INode
if (hitNode.labels.size > 0) {
// Show the text of the first label as tooltip.
args.toolTip = hitNode.labels.get(0).text
// Indicate that the tooltip content has been set.
args.handled = true
}
})See Also
Event Registration
addQueryToolTipListener(function(this, ToolTipQueryEventArgs):void)Event Deregistration
removeQueryToolTipListener(function(this, ToolTipQueryEventArgs):void)Signature Details
function(sender: this, evt: ToolTipQueryEventArgs)
Parameters
- sender - this
- The source of the event.
- evt - ToolTipQueryEventArgs
- An object that contains the event data.