JSDoc: Class: GraphEditor

Name	Type	Attributes	Description
`zoomed`	boolean		False if the graph is clicked.
`dragged`	boolean		False if a node is clicked.
`simulation`	D3Simulation	<nullable>	Current simulation object.
`simulationStarted`	boolean		True if a simulation is started.
`dragToLink`	boolean		True in 'drag to link nodes' mode.
`newLinkTarget`	Node	<nullable>	New link target in 'drag to link nodes' mode.
`selectedNode`	Node	<nullable>	Selected node.
`selectedLink`	Link	<nullable>	Selected link.
`dragPos`	Point	<nullable>	Last drag end position.
`zoom`	number		Zoom level.

Source:

js/init.js, line 180

(readonly) svg :D3Selection

Graph SVG element.

Type:

D3Selection

Source:

js/init.js, line 118

(readonly) textSize :ge.TextSize

Text size calculator.

Type:

ge.TextSize

Source:

js/init.js, line 107

typeDefaults :Array.<GraphOptions>

Default options by graph type.

Type:

Array.<GraphOptions>

Source:

js/options.js, line 84

(readonly) zoom :D3Zoom

Graph zoom behavior.

Type:

D3Zoom

Source:

main.js, line 51

Methods

(private) _remove(data, skipUpdateopt) → {boolean}

Remove a node or a link.

Parameters:

Name	Type	Attributes	Default	Description
`data`	Reference			Reference.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 274

Returns:

False if object does not exist.

Type: boolean

(private) _removeLink(idx)

Remove a link by index.

Parameters:

Name	Type	Description
`idx`	number	Link index.

Source:

js/controls.js, line 193

add(data, skipUpdateopt)

Add one or multiple nodes/links.

Parameters:

Name	Type	Attributes	Default	Description
`data`	ImportNodeData \| ImportLinkData \| Array.<(ImportNodeData\|ImportLinkData)>			Data.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 162

addLink(link, skipUpdateopt) → (nullable) {ge.Link}

Add a link if it does not exist.

Parameters:

Name	Type	Attributes	Default	Description
`link`	ImportLinkData			Link data.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 115

Returns:

Added link.

Type: ge.Link

addLinks(links, skipUpdateopt) → {Array.<Link>}

Add multiple links.

Parameters:

Name	Type	Attributes	Default	Description
`links`	Array.<ImportLinkData>			Link data.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 148

Returns:

Added links.

Type: Array.<Link>

addNode(node, skipUpdateopt) → (nullable) {ge.Node}

Add a node if it does not exist.

Parameters:

Name	Type	Attributes	Default	Description
`node`	ImportNodeData			Node data.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 96

Returns:

Added node.

Type: ge.Node

addNodes(nodes, skipUpdateopt)

Add multiple nodes.

Parameters:

Name	Type	Attributes	Default	Description
`nodes`	Array.<ImportNodeData>			Node data.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 133

clear(clearDataopt) → {ge.GraphEditor}

Clear graph DOM.

Parameters:

Name	Type	Attributes	Default	Description
`clearData`	boolean	<optional>	true	Clear graph data.

Source:

js/controls.js, line 559

Fires:

event:simulation-stop

Returns:

Type: ge.GraphEditor

(private) clickPosition(containeropt) → {Point}

Get mouse or touch coordinates relative to container.

Parameters:

Name	Type	Attributes	Default	Description
`container`	HTMLElement \| SVGElement	<optional>	this.container.node()

Source:

js/events.js, line 23

See:

Returns:

Type: Point

destroy() → {ge.GraphEditor}

Destroy the graph.

Source:

js/controls.js, line 601

Fires:

event:simulation-stop

Returns:

Type: ge.GraphEditor

(private) dragEvents(drag) → {D3Drag}

Set node drag event handlers.

Parameters:

Name	Type	Description
`drag`	D3Drag	Node drag behavior.

Source:

js/events.js, line 67

Fires:

Returns:

Type: D3Drag

dragToLink() → {boolean}

Return true if 'drag to link nodes' is enabled.

Source:

js/controls.js, line 541

Returns:

Type: boolean

dragToLink(onopt) → {ge.GraphEditor}

Set 'drag to link nodes' state.

Parameters:

Name	Type	Attributes	Description
`on`	boolean \| string	<optional>	state \| 'toggle'

Source:

js/controls.js, line 541

Returns:

Type: ge.GraphEditor

getData(elnullable) → (nullable) {Node|Link}

Get node/link data.

Parameters:

Name	Type	Attributes	Description
`el`	Reference	<nullable>

Source:

js/controls.js, line 42

Returns:

Type: Node | Link

getElement(elnullable) → (nullable) {D3Selection}

Get node/link SVG element.

Parameters:

Name	Type	Attributes	Description
`el`	Reference	<nullable>

Source:

js/controls.js, line 18

Returns:

Type: D3Selection

(private) initData(data) → {ge.GraphEditor}

Initialize graph data.

This:

ge.GraphEditor

Parameters:

Name	Type	Description
`data`	ImportGraphData

Source:

js/init.js, line 131

Returns:

Type: ge.GraphEditor

(private) initMarkers(svg) → {ge.GraphEditor}

Create SVG markers.

Parameters:

Name	Type	Description
`svg`	D3Selection

Source:

js/init.js, line 9

Returns:

Type: ge.GraphEditor

(private) initOptions(options, svg) → {ge.GraphEditor}

Initialize graph options.

Parameters:

Name	Type	Description
`options`	GraphOptions
`svg`	D3Selection

Source:

js/options.js, line 119

Returns:

Type: ge.GraphEditor

(private) initState() → {ge.GraphEditor}

Initialize graph state.

This:

ge.GraphEditor

Source:

js/init.js, line 164

Returns:

Type: ge.GraphEditor

(private) initSvg(svg) → {ge.GraphEditor}

Initialize SVG element.

This:

ge.GraphEditor

Parameters:

Name	Type	Description
`svg`	D3Selection

Source:

js/init.js, line 55

Returns:

Type: ge.GraphEditor

(private) isLinkData(data) → {boolean}

Return true if object is a link.

Parameters:

Name	Type	Description
`data`	Object

Source:

js/controls.js, line 9

Returns:

Type: boolean

(private) linkEvents(links) → {D3Selection}

Set link event handlers.

Parameters:

Name	Type	Description
`links`	D3Selection

Source:

js/events.js, line 221

Fires:

event:link-click

Returns:

Type: D3Selection

(private) linkId(source, target) → {ID}

Get link ID.

Parameters:

Name	Type	Description
`source`	ge.Node	Link source.
`target`	ge.Node	Link target.

Source:

js/controls.js, line 78

Returns:

Type: ID

(private) nodeEvents(nodes) → {D3Selection}

Set node event handlers.

Parameters:

Name	Type	Description
`nodes`	D3Selection

Source:

js/events.js, line 246

Returns:

Type: D3Selection

(private) nodeId() → {ID}

Get unused node ID.

Source:

js/controls.js, line 63

Returns:

Type: ID

on(event, handlernullable) → {ge.GraphEditor}

Add an event handler.

Parameters:

Name	Type	Attributes	Description
`event`	string
`handler`	function	<nullable>

Source:

js/events.js, line 10

See:

d3.dispatch.on

Returns:

Type: ge.GraphEditor

redraw() → {ge.GraphEditor}

Regenerate graph DOM.

Source:

js/controls.js, line 592

Fires:

event:simulation-stop

Returns:

Type: ge.GraphEditor

remove(data, skipUpdateopt)

Remove one or multiple nodes/links.

Parameters:

Name	Type	Attributes	Default	Description
`data`	Reference \| Array.<Reference>			References.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 287

removeLink(data, skipUpdateopt) → {boolean}

Remove a link.

Parameters:

Name	Type	Attributes	Default	Description
`data`	Reference			Link.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 207

Returns:

False if link does not exist.

Type: boolean

removeNode(data, skipUpdateopt) → {boolean}

Remove a node.

Parameters:

Name	Type	Attributes	Default	Description
`data`	Reference			Node.
`skipUpdate`	boolean	<optional>	false	Skip DOM update.

Source:

js/controls.js, line 232

Returns:

False if node does not exist.

Type: boolean

resized() → {ge.GraphEditor}

Handle graph SVG element resize.

Source:

js/update.js, line 94

Returns:

Type: ge.GraphEditor

select(dataopt, nullable, updateopt) → {ge.GraphEditor}

Select a node or a link.

Parameters:

Name	Type	Attributes	Default	Description
`data`	Reference	<optional> <nullable>		Node or link to select.
`update`	boolean	<optional>	false	Update DOM if the node/link is already selected.

Source:

js/controls.js, line 405

Returns:

Type: ge.GraphEditor

select() → {Selection}

Return selected node/link.

Source:

js/controls.js, line 405

Returns:

Type: Selection

selectLink(linkopt, nullable, updateopt) → {ge.GraphEditor}

Selected a link.

Parameters:

Name	Type	Attributes	Default	Description
`link`	Reference	<optional> <nullable>		Link to select.
`update`	boolean	<optional>	false	Update DOM if the link is already selected.

Source:

js/controls.js, line 366

Returns:

Type: ge.GraphEditor

selectLink() → (nullable) {Link}

Return selected link.

Source:

js/controls.js, line 366

Returns:

Type: Link

selectNode(nodeopt, nullable, updateopt) → {ge.GraphEditor}

Select a node.

Parameters:

Name	Type	Attributes	Default	Description
`node`	Reference	<optional> <nullable>		Node to select.
`update`	boolean	<optional>	false	Update DOM if the node is already selected.

Source:

js/controls.js, line 313

Returns:

Type: ge.GraphEditor

selectNode() → (nullable) {Node}

Return selected node.

Source:

js/controls.js, line 313

Returns:

Type: Node

simulation(onopt) → {boolean|ge.GraphEditor}

Set or return force simulation state.

Parameters:

Name	Type	Attributes	Description
`on`	boolean \| string	<optional>	state \| 'start' \| 'stop' \| 'restart' \| 'toggle'

Source:

js/controls.js, line 513

Fires:

Returns:

Type: boolean | ge.GraphEditor

startSimulation(stopOnEndopt) → {ge.GraphEditor}

Start force simulation.

Parameters:

Name	Type	Attributes	Default	Description
`stopOnEnd`	boolean	<optional>	this.options.simulation.stop	Stop the simulation when it converges.

Source:

js/controls.js, line 431

Fires:

event:simulation-start

Returns:

Type: ge.GraphEditor

stopSimulation() → {ge.GraphEditor}

Stop force simulation.

Source:

js/controls.js, line 494

Fires:

event:simulation-stop

Returns:

Type: ge.GraphEditor

toJson() → {ExportGraphData}

Convert to JSON.

Source:

js/controls.js, line 623

Returns:

Type: ExportGraphData

(private) touchedNode() → (nullable) {Node}

Get touched node.

Source:

js/events.js, line 35

See:

Returns:

Type: Node

(private) transition(selection, type, name) → {ge.GraphEditor}

Create a transition if necessary.

Parameters:

Name	Type	Description
`selection`	D3Selection
`type`	string	duration = options.transition[type]
`name`	string

Source:

js/update.js, line 12

See:

d3.transition

Returns:

Type: ge.GraphEditor

update(simulationopt) → {ge.GraphEditor}

Update everything.

Parameters:

Name	Type	Attributes	Default	Description
`simulation`	boolean	<optional>	false	True if called from the simulation tick handler.

Source:

js/update.js, line 291

Returns:

Type: ge.GraphEditor

(private) updateBBox(nodeopt) → {ge.GraphEditor}

Update bounding box.

Parameters:

Name	Type	Attributes	Description
`node`	Node	<optional>	Moved node.

Source:

js/update.js, line 125

Returns:

Type: ge.GraphEditor

(private) updateExtent() → {ge.GraphEditor}

Update zoom behavior extent.

Source:

js/update.js, line 164

Returns:

Type: ge.GraphEditor

updateLink(link) → {ge.GraphEditor}

Update a link.

Parameters:

Name	Type	Description
`link`	Reference	Changed link.

Source:

js/update.js, line 179

Returns:

Type: ge.GraphEditor

updateNode(node) → {ge.GraphEditor}

Update a node. If it was moved or resized, update its links.

Parameters:

Name	Type	Description
`node`	Reference	Changed node.

Source:

js/update.js, line 196

Returns:

Type: ge.GraphEditor

(private) updateSimulation() → {ge.GraphEditor}

Update force simulation.

Source:

js/update.js, line 105

Returns:

Type: ge.GraphEditor

(private) zoomEvents(zoom) → {D3Zoom}

Set zoom event handlers.

Parameters:

Name	Type	Description
`zoom`	D3Zoom	Graph zoom behavior.

Source:

js/events.js, line 153

Fires:

event:click

Returns:

Type: D3Zoom