Light High Efficiency Graph Component

Qunee Developer Guide


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:

Switch interaction mode

The current interaction mode can be switched by the property of #interactionMode


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){
graph.interactionMode = "CUSTOM-MODE";