Tooltips

Search
Feedback

With the Tooltip module it is possible to show a html window beside a clicked or hovered node . To enable the Graph-Browser to show the toolstips a new page in structr must be created that creates the desired look for the tooltip when it is called with the id of the activated node.

Dependencies for this module:

Settings

Fields Type Description
node.showOn string The event that triggers the tooltip of a node
node.hideOn string The event that triggers the hiding of a nodes tooltip
node.cssClass string This is a field for optional classes for the outer html tooltip window
node.position string This indicates the position to the activated node (TOP, BOTTOM...)
node.renderer function(node) This should be the renderer function that creates a html representation of the the content for the tooltip. Its only parameter is the node object itself.
edge.showOn string The event that triggers the tooltip of a edge
edge.hideOn string The event that triggers the hiding of a edges tooltip
edge.cssClass string This is a field for optional classes for the outer html tooltip window
edge.position string This indicates the position to the activated edge (top, bottom...)
edge.renderer function(edge) This should be the renderer function that creates a html representation of the the content for the tooltip. Its only parameter is the edge object itself.
Example
var graphSettings = {
   graphContainer: 'graph-container',
   moduleSettings: {
        'tooltips': {
            node: {
                showOn: 'rightClickNode',
                hideOn: 'clickStage',
                cssClass: 'tooltip-container',
                position: 'bottom',
                renderer: myRendererFunction
            }
        }
    }
};

var graphBrowser = new GraphBrowser(graphSettings);

Functions

Name Parameters Description
openTooltip(node) node Specifies the node for wich the tooltip should be opened Programmatically way to open a tooltip for a node way to open a tooltip for a node
closeTooltip() Closes the currently shown tooltip.

Graph-Browser

About this article
Last change 2017-07-18
Topics ExperimentalStructr 2.0