Configuration for adding mouse/touch event handlers to Nodes.
Options.Events = {
enable: false,
enableForEdges: false,
type: 'auto',
onClick: $.empty,
onRightClick: $.empty,
onMouseMove: $.empty,
onMouseEnter: $.empty,
onMouseLeave: $.empty,
onDragStart: $.empty,
onDragMove: $.empty,
onDragCancel: $.empty,
onDragEnd: $.empty,
onTouchStart: $.empty,
onTouchMove: $.empty,
onTouchEnd: $.empty,
onTouchCancel: $.empty,
onMouseWheel: $.empty
};
var viz = new $jit.Viz({
Events: {
enable: true,
onClick: function(node, eventInfo, e) {
viz.doSomething();
},
onMouseEnter: function(node, eventInfo, e) {
viz.canvas.getElement().style.cursor = 'pointer';
},
onMouseLeave: function(node, eventInfo, e) {
viz.canvas.getElement().style.cursor = '';
}
}
});
| enable | (boolean) Default’s false. Whether to enable the Event system. |
| enableForEdges | (boolean) Default’s false. Whether to track events also in arcs. If true the same callbacks -described below- are used for nodes and edges. A simple duck type check for edges is to check for node.nodeFrom. |
| type | (string) Default’s ‘auto’. Whether to attach the events onto the HTML labels (via event delegation) or to use the custom ‘Native’ canvas Event System of the library. ‘auto’ is set when you let the Options.Label type parameter decide this. |
| onClick(node, eventInfo, e) | Triggered when a user performs a click in the canvas. node is the Graph.Node clicked or false if no node has been clicked. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onRightClick(node, eventInfo, e) | Triggered when a user performs a right click in the canvas. node is the Graph.Node right clicked or false if no node has been clicked. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onMouseMove(node, eventInfo, e) | Triggered when the user moves the mouse. node is the Graph.Node under the cursor as it’s moving over the canvas or false if no node has been clicked. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onMouseEnter(node, eventInfo, e) | Triggered when a user moves the mouse over a node. node is the Graph.Node that the mouse just entered. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onMouseLeave(node, eventInfo, e) | Triggered when the user mouse-outs a node. node is the Graph.Node ‘mouse-outed’. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onDragStart(node, eventInfo, e) | Triggered when the user mouse-downs over a node. node is the Graph.Node being pressed. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onDragMove(node, eventInfo, e) | Triggered when a user, after pressing the mouse button over a node, moves the mouse around. node is the Graph.Node being dragged. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onDragEnd(node, eventInfo, e) | Triggered when a user finished dragging a node. node is the Graph.Node being dragged. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onDragCancel(node, eventInfo, e) | Triggered when the user releases the mouse button over a Graph.Node that wasn’t dragged (i.e. the user didn’t perform any mouse movement after pressing the mouse button). node is the Graph.Node being dragged. e is the grabbed event (should return the native event in a cross-browser manner). eventInfo is an object containing useful methods like getPos to get the mouse position relative to the canvas. |
| onTouchStart(node, eventInfo, e) | Behaves just like onDragStart. |
| onTouchMove(node, eventInfo, e) | Behaves just like onDragMove. |
| onTouchEnd(node, eventInfo, e) | Behaves just like onDragEnd. |
| onTouchCancel(node, eventInfo, e) | Behaves just like onDragCancel. |
| onMouseWheel(delta, e) | Triggered when the user uses the mouse scroll over the canvas. delta is 1 or -1 depending on the sense of the mouse scroll. |