Graph#interactionMode
Each interaction device realizes one function. A group of interaction devices coordinates for one work, forming an interaction mode, such as default interaction mode which includes the translate interaction device, node drag interaction device, spot selection interaction device, text hint interaction device and so on. We can combine different interaction devices for satisfying the demand of interaction.
Following several interaction modes are supplied in default:
- Consts.INTERACTION_MODE_DEFAULT - default interaction mode
- Consts.INTERACTION_MODE_SELECTION - frame selection interaction mode
- Consts.INTERACTION_MODE_ZOOMIN - zoom in interaction mode
- Consts.INTERACTION_MODE_ZOOMOUT - zoom out interaction mode
Switch interaction mode
The current interaction mode can be switched by the property of #interactionMode
Example
Switched to frame selection interaction mode
graph.interactionMode = Q.Consts.INTERACTION_MODE_SELECTION;
Custom interaction mode
The interaction mode can also be completely customized. There are two steps: firstly register a new name of interaction mode, such as “VIEW_MODE”, and then set this name to the component of network graph
For example, registers a new interaction mode, and applies the translation, text hint and custom combination of interaction device
Q.Defaults.registerInteractions("CUSTOM-MODE", [Q.PanInteraction, Q.TooltipInteraction, {
onclick: function(evt, graph){
Q.log(evt);
}
}]);
graph.interactionMode = "CUSTOM-MODE";
Other related properties and methods of interaction
- #enableTooltip :Boolean - whether the prompt text is displayed
- #enableWheelZoom :Boolean - whether the mouse wheel will be used for zooming