chevron_right Demos chevron_right Tooltips & Popovers
Discover More
Book a live Demo

See yFiles in action

30 min • Online • No install required


For developers, PMs & tech leads

  • Quick-start walkthrough + a real integration example
  • Live Q&A with next-step recommendations

Prefer another tool over Zoom? Just say so when you book.

Opens our scheduling page with Zoom's booking widget embedded. Using it shares your data with Zoom under its Privacy Policy.

See yFiles in action

30 min • Online • No install required


For developers, PMs & tech leads

Prefer another tool over Zoom? Just say so when you book.

Opens our scheduling page with Zoom's booking widget embedded. Using it shares your data with Zoom under its Privacy Policy.

Tooltips & Popovers

This demo shows how to enable tooltips and popovers for graph items, how to customize them using CSS styling, and how to configure different tooltip and popover behaviors.

Behaviors

Try different tooltip behaviors by hovering or clicking the nodes. There are many configurations possible, this demo shows the following behaviors:

Default

Tooltips with the default behavior for nodes and edges.

Above Nodes

Tooltips always appear centered above the node.

Mouse Attached

Tooltips follow the pointer when moving on the same item.

Viewport Bottom Center

Tooltips appear centered at the bottom of the viewport.

Light-dismissable Popover

Clicking a node opens an exclusive, light-dismissable popover while still showing tooltips for other items.

Manual Popovers

Clicking a node opens a static popover while still showing tooltips for other items. Multiple popovers may be opened at the same time.