Node Expander

Search
Feedback

The Node Expander Module enables the user to expand a node with new nodes from the database with incoming and outgoing relationships.

There are two options to trigger the loading of new nodes to a graph view. When a node is doubleclicked, the module will load all neighboring nodes and will add them directly to the view. For the second option, the module will display html buttons for each nodetype, that’s within the newly loaded nodes from the database, around a hovered node. Every button has the same backgroundcolor as the nodes with the same nodetypes have in the graph view. When one of the buttons is clicked, all nodes with the buttons’ nodetype will be added to the graph view.

The New Node Picker module can be used to filter unwanted nodes.

Dependencies for this module:

  • jquery
  • sigma.min.js
  • graph.browser.core.js
  • graph.browser.restcontrol.js
  • graph.browser.modulecontrol.js
  • graph.browser.module.nodeexpander.js

Settings

fields type description
container String This is the container where the buttons and the labels for the nodeexpanding are added. The container should be over the element that holds the graphview.
margins.left int With this setting the expandbuttons can have a additional margin to the left side of the screen
margins.top int With this setting the expandbuttons can have a additional margin to the top of the screen

Example

var graphSettings = {
    graphContainer: 'graph-container',
    moduleSettings: {'nodeExpander': {'container': 'graph-info', 'margins': {'top': 20, 'left': -5}, onNodesAdded: doAfterNodesAdded} }  
};

var graphBrowser = new GraphBrowser(graphSettings);

Created HTML fields

tag classes purpose
<button> nodeExpander-expandbutton These buttons will be added around the hovered node. When clicked every node of the buttons’ nodetype will be added to the graph view
<button> btn btn-xs nodeExpander-infobutton These buttons will be added to the container that was specified in the settings. They represent the nodetypes that can be loaded when hovering a node in the graphview

Graph-Browser

About this article
Last change 2016-08-29
Topics ExperimentalStructr 2.0