Events

Description

We provide three of click event interfaces; onClickNode, onClickEdge, onClickBackground.

export interface ServerMapProps {
  data: {
    nodes: Node[],
    edges: Edge[],
  };
  baseNodeId: string;
  customTheme?: any;
  onClickNode?: ClickEventHandler<MergedNode>;
  onClickEdge?: ClickEventHandler<MergedEdge>;
  onClickBackground?: ClickEventHandler<{}>;
  renderNodeLabel?: (node: MergedNode) => string | undefined;
  renderEdgeLabel?: (edge: MergedEdge) => string | undefined;
}

type ClickEventHandler<T> = (param: {
  data?: T,
  eventType: 'right' | 'left',
  position: cytoscape.Position,
}) => void;

onClickNode

Callback to execute when clicking nodes.

Props of Callback Parameter

Props	Type	description
data	MergedNode : { nodes?: Node[] } & Node	Target node data
eventType	"right" or "left"	Mouse click type
position	cytoscape.Position : { x: number, y: number }	Coordinates where the event occurred

onClickEdge

Callback to execute when clicking edges.

Props of Callback Parameter

Props	Type	description
data	MergedEdge : { nodes?: Edge[] } & Edge	Targe edge data
eventType	"right" or "left"	Mouse click type
position	cytoscape.Position : { x: number, y: number }	Coordinates where the event occurred

onClickBackground

Callback to execute when clicking background.

Props of Callback Parameter

Props	Type	description
eventType	"right" or "left"	Mouse click type
position	cytoscape.Position : { x: number, y: number }	Coordinates where the event occurred