Skip to content
  1. Events

Events

addEdges

Event triggered when some edges are added to the graph.

Properties

addGraph

Event triggered when a graph is added (using addGraph method)

Properties

addNodes

Event triggered when some nodes are added to the graph.

Properties

animate

Triggered when the animation is called on nodes or edges.

Properties

beforeRemoveEdges

Triggers right before the edges are removed, but they are still in the graph and their data is accessible.

Properties

beforeRemoveNodes

Triggers right before the nodes are removed, but they are still in the graph and their data is accessible.

Properties

clearGraph

Event triggered when ogma.clearGraph is called.

Properties

click

Event triggered when the user presses and releases a mouse button without moving in between. Also triggers as a left button when the user presses and releases their finger (on touch devices).

Properties

connectNodes

Triggered when two nodes are connected using the module.

Properties

destroy

Fired before Ogma instance is destroyed. Can be useful to remove some event listeners.

doubleclick

Event triggered when the user presses and releases a mouse button twice without moving in between.

Properties

dragEnd

Event triggered when the user releases a mouse button, if a onDragStart has been emitted before.

Properties

dragProgress

Event triggered every time the user moves the mouse after a onDragStart event has been emitted, as long as the user doesn't release the mouse. If a node or edge was under the cursor when the first onDragStart event was emitted, it is passed as the target property.

Properties

dragStart

Event triggered when the user presses a mouse button and then moves the mouse (without releasing the button).

Properties

drop

Triggered when the user drops an element into the Ogma container. Note that x and y arguments are Graph coordinates.

Properties

  • domEvent DragEvent
  • x number
  • y number

edgeClassAdded_MyClass

Triggered when the specified class (MyClass) is added to some edges.

Properties

edgeClassRemoved_MyClass

Triggered when the specified class (MyClass) is removed from some edges.

Properties

edgesSelected

Event triggered when edges are selected

Properties

edgesUnSelected

Event triggered when edges are unselected

Properties

frame

Event triggered when a frame is rendered.

geoDisabled

Triggered when the geo mode is switched off

geoEnabled

Triggered when the geo mode is activated

geoLoaded

Triggered when the background map images are loaded

gestureEnd

Event triggered when the user stop touching the screen with two fingers.

Properties

  • domEvent Event

gestureProgress

Event triggered when the users moves two fingers.

Properties

  • angle number
  • domEvent Event
  • dx number
  • dy number
  • scale number
  • x number
  • y number

gestureStart

Event triggered when the user touch the screen with two fingers.

Properties

  • domEvent Event

idle

Triggered when the graph is idle (no more camera movements, no more layout iterations).

keydown

Event triggered when the user presses the keyboard button.

Properties

  • domEvent KeyboardEvent
  • key string
  • keyCode number

keyup

Event triggered when the user releases the keyboard button.

Properties

  • domEvent KeyboardEvent
  • key string
  • keyCode number

layoutComputed

This event is fired after the layout algorithm has finished the calculations, but before the positions are applied. Use it for UI interactions, because if you would add position manipulations into the listener, they can interfere with the layout results.

Properties

  • name string

layoutEnd

Trigger the specified function when two nodes are connected using the module.

Properties

layoutStart

Triggered when two nodes are connected using the module.

Properties

mousedown

Event triggered when the user presses a mouse button. Also triggers as a left button when the user presses their finger (on touch devices).

Properties

mousemove

Event triggered when the user moves the mouse (or their finger in touch devices).

Properties

  • domEvent Event
  • dx number
  • dy number
  • source InputSource
  • x number
  • y number

mouseout

Event triggered when a node or edge stops being hovered.

Properties

  • domEvent Event - The original DOM event.
  • source InputSource - The source of the event.
  • target InputTarget - The target of the event.
  • x number - The x coordinate of the mouse.
  • y number - The y coordinate of the mouse.

mouseover

Event triggered when a node or edge is hovered.

Properties

mouseup

Event triggered when the user releases a mouse button. Also triggers as a left button when the user releases their finger (on touch devices).

Properties

mousewheel

Event triggered when the user uses the mouse wheel.

Properties

  • delta number - The delta of the mouse wheel.
  • domEvent Event - The original DOM event.
  • source InputSource - The source of the event.
  • target InputTarget - The target of the event.
  • x number - The x coordinate of the mouse.
  • y number - The y coordinate of the mouse.

move

Event triggered when camera is moving.

nodeClassAdded_MyClass

Triggered when the specified class (MyClass) is added to some nodes.

Properties

nodeClassRemoved_MyClass

Triggered when the specified class (MyClass) is removed from some nodes.

Properties

nodesDragEnd

Triggered when the user stop dragging some nodes.

Properties

  • end Array<{x: number, y: number}>
  • nodes NodeList
  • start Array<{x: number, y: number}>

nodesDragProgress

Triggered when the user drags some nodes.

Properties

nodesDragStart

Triggered when the user starts to drag some nodes.

Properties

nodesSelected

Event triggered when nodes are selected

Properties

nodesUnselected

Event triggered when nodes are unselected

Properties

refreshStyleRule

Property {StyleRule} rule Rule that has been applied

removeEdges

Event triggered when some edges are removed from the graph.

Properties

removeNodes

Event triggered when some nodes are removed from the graph.

Properties

rendererStateChange

Triggered when the renderer is requested, successfully initialized or encounters an error.

Properties

resize

Properties

  • difHeigh number
  • difWidth number
  • height, number
  • prevHeight number
  • prevWidth number
  • width number

rotate

Event triggered when camera is moving.

tooltipHide

Event triggered when a tooltip is hidden.

Properties

  • tooltip HTMLElement

tooltipShow

Event triggered when a tooltip is shown.

Properties

  • tooltip HTMLElement

transformationDestroyed

Triggered when a transformation is destroyed

Properties

transformationDisabled

Triggered when a transformation is disabled

Properties

transformationEnabled

Triggered when a transformation is activated

Properties

transformationRefresh

Triggered when a transformation is refreshed

Properties

transformationSetIndex

Triggered when a transformation index is set

Properties

updateEdgeData

Properties

  • changes changes: Array<{property: PropertyPath, edges: EdgeList, previousValues: Array<any>, newValues: Array<any>}>

updateNodeData

Trigger the specified function when the data of some nodes is updated.

Properties

  • changes Array<{property: PropertyPath, nodes: NodeList, previousValues: Array<any>, newValues: Array<any>}>

viewChanged

Event triggered when a camera movement (zoom, panning, rotation) is finished.

viewExportStart

Event triggered when exporting the graph in png, jpg or svg.

Properties

  • camera Camera

zoomStart

Triggered when camera starts zoom.

Properties

  • duration number
  • easing Easing
  • endZoom number Target zoom leve
  • startZoom number Zoom level at the start of the zoom.