GraphVisualization

@graph-viz › Globals › core › GraphVisualization

Hierarchy

• GraphVisualization

Index

Constructors

• constructor

Properties

• camera
• canvas
• config
• data
• groupsMesh
• height
• linksMesh
• mouseInteraction
• nodeIdToIndexMap
• nodesMesh
• registeredEventHandlers
• renderer
• scene
• userHasAdjustedViewport
• width

Methods

• dispose
• handleClick
• handleDragEnd
• handleDragStart
• handleHoverIn
• handleHoverOut
• handleNodeDrag
• handlePan
• handleSecondaryClick
• handleZoomOnWheel
• onClick
• onDragEnd
• onDragStart
• onNodeDrag
• onNodeHoverIn
• onNodeHoverOut
• onPan
• onSecondaryClick
• onZoom
• render
• resize
• toScreenSpacePoint
• update
• updateConfig
• updateGroups
• updateNode
• updatePositions
• zoom
• zoomToFit

Constructors

constructor

+ new GraphVisualization(graphData: VisualizationInputData, canvas: HTMLCanvasElement, width: number, height: number, config: ConfigurationOptions): GraphVisualization

Defined in packages/core/src/GraphVisualization.ts:108

Parameters:

Name	Type	Default
graphData	VisualizationInputData	-
canvas	HTMLCanvasElement	-
width	number	-
height	number	-
config	ConfigurationOptions	DEFAULT_CONFIG_OPTIONS

Returns: GraphVisualization

Properties

Readonly camera

• camera: OrthographicCamera

Defined in packages/core/src/GraphVisualization.ts:84

---

Readonly canvas

• canvas: HTMLCanvasElement

Defined in packages/core/src/GraphVisualization.ts:83

---

Private config

• config: ConfigurationOptions = DEFAULT_CONFIG_OPTIONS

Defined in packages/core/src/GraphVisualization.ts:108

---

Private data

• data: VisualizationInputData

Defined in packages/core/src/GraphVisualization.ts:86

---

groupsMesh

• groupsMesh: DisplayGroups

Defined in packages/core/src/GraphVisualization.ts:81

---

Private height

• height: number

Defined in packages/core/src/GraphVisualization.ts:103

---

linksMesh

• linksMesh: Links

Defined in packages/core/src/GraphVisualization.ts:80

---

Private Readonly mouseInteraction

• mouseInteraction: MouseInteraction

Defined in packages/core/src/GraphVisualization.ts:107

---

Private nodeIdToIndexMap

• nodeIdToIndexMap: object

Defined in packages/core/src/GraphVisualization.ts:87

Type declaration:

• [ key: string]: number

---

nodesMesh

• nodesMesh: Nodes

Defined in packages/core/src/GraphVisualization.ts:79

---

Private registeredEventHandlers

• registeredEventHandlers: object

Defined in packages/core/src/GraphVisualization.ts:90

Type declaration:

• click? : ClickEventHandler

• dragEnd? : DragEndEventHandler

• dragStart? : DragStartEventHandler

• nodeDrag? : NodeDragEventHandler

• nodeHoverIn? : HoverEventHandler

• nodeHoverOut? : HoverEventHandler

• pan? : PanEventHandler

• secondaryClick? : SecondaryClickEventHandler

• zoom? : ZoomEventHandler

---

Private Readonly renderer

• renderer: WebGLRenderer

Defined in packages/core/src/GraphVisualization.ts:106

---

Private Readonly scene

• scene: Scene

Defined in packages/core/src/GraphVisualization.ts:105

---

Private userHasAdjustedViewport

• userHasAdjustedViewport: boolean

Defined in packages/core/src/GraphVisualization.ts:88

---

Private width

• width: number

Defined in packages/core/src/GraphVisualization.ts:102

Methods

dispose

▸ dispose(): void

Defined in packages/core/src/GraphVisualization.ts:439

disposes the graph viz context

Returns: void

---

Private handleClick

▸ handleClick(worldSpaceMouse: Vector3, clickedNodeIdx: number | null, event: MouseEvent): void

Defined in packages/core/src/GraphVisualization.ts:583

Parameters:

Name	Type
worldSpaceMouse	Vector3
clickedNodeIdx	number | null
event	MouseEvent

Returns: void

---

Private handleDragEnd

▸ handleDragEnd(worldSpaceMouse: Vector3, nodeIdx: number, event: MouseEvent): void

Defined in packages/core/src/GraphVisualization.ts:535

Parameters:

Name	Type
worldSpaceMouse	Vector3
nodeIdx	number
event	MouseEvent

Returns: void

---

Private handleDragStart

▸ handleDragStart(worldSpaceMouse: Vector3, draggedNodeIdx: number | null, event: MouseEvent): void

Defined in packages/core/src/GraphVisualization.ts:509

Parameters:

Name	Type
worldSpaceMouse	Vector3
draggedNodeIdx	number | null
event	MouseEvent

Returns: void

---

Private handleHoverIn

▸ handleHoverIn(hoveredToNodeIdx: number): void

Defined in packages/core/src/GraphVisualization.ts:493

Parameters:

Name	Type
hoveredToNodeIdx	number

Returns: void

---

Private handleHoverOut

▸ handleHoverOut(hoveredFromNodeIdx: number): void

Defined in packages/core/src/GraphVisualization.ts:501

Parameters:

Name	Type
hoveredFromNodeIdx	number

Returns: void

---

Private handleNodeDrag

▸ handleNodeDrag(worldSpaceMouse: Vector3, draggedNodeIdx: number): void

Defined in packages/core/src/GraphVisualization.ts:525

Parameters:

Name	Type
worldSpaceMouse	Vector3
draggedNodeIdx	number

Returns: void

---

Private handlePan

▸ handlePan(panDelta: Vector3): void

Defined in packages/core/src/GraphVisualization.ts:545

Parameters:

Name	Type
panDelta	Vector3

Returns: void

---

Private handleSecondaryClick

▸ handleSecondaryClick(event: MouseEvent, clickedNodeIdx: number | null): void

Defined in packages/core/src/GraphVisualization.ts:596

Parameters:

Name	Type
event	MouseEvent
clickedNodeIdx	number | null

Returns: void

---

Private handleZoomOnWheel

▸ handleZoomOnWheel(event: MouseWheelEvent): void

Defined in packages/core/src/GraphVisualization.ts:567

Parameters:

Name	Type
event	MouseWheelEvent

Returns: void

---

onClick

▸ onClick(callback: ClickEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:266

Parameters:

Name	Type
callback	ClickEventHandler

Returns: void

---

onDragEnd

▸ onDragEnd(callback: DragEndEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:276

Parameters:

Name	Type
callback	DragEndEventHandler

Returns: void

---

onDragStart

▸ onDragStart(callback: DragStartEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:271

Parameters:

Name	Type
callback	DragStartEventHandler

Returns: void

---

onNodeDrag

▸ onNodeDrag(callback: NodeDragEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:281

Parameters:

Name	Type
callback	NodeDragEventHandler

Returns: void

---

onNodeHoverIn

▸ onNodeHoverIn(callback: HoverEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:256

Parameters:

Name	Type
callback	HoverEventHandler

Returns: void

---

onNodeHoverOut

▸ onNodeHoverOut(callback: HoverEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:261

Parameters:

Name	Type
callback	HoverEventHandler

Returns: void

---

onPan

▸ onPan(callback: PanEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:291

Parameters:

Name	Type
callback	PanEventHandler

Returns: void

---

onSecondaryClick

▸ onSecondaryClick(callback: SecondaryClickEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:286

Parameters:

Name	Type
callback	SecondaryClickEventHandler

Returns: void

---

onZoom

▸ onZoom(callback: ZoomEventHandler): void

Defined in packages/core/src/GraphVisualization.ts:296

Parameters:

Name	Type
callback	ZoomEventHandler

Returns: void

---

render

▸ render(): void

Defined in packages/core/src/GraphVisualization.ts:300

Returns: void

---

resize

▸ resize(width: number, height: number): void

Defined in packages/core/src/GraphVisualization.ts:391

resize the canvas

Parameters:

Name	Type	Description
width	number	-
height	number

Returns: void

---

toScreenSpacePoint

▸ toScreenSpacePoint(worldX: number, worldY: number): Vector3

Defined in packages/core/src/GraphVisualization.ts:412

converts a world space coordinate to screen space

Parameters:

Name	Type	Default	Description
worldX	number	0	-
worldY	number	0

Returns: Vector3

---

update

▸ update(graphData: VisualizationInputData): void

Defined in packages/core/src/GraphVisualization.ts:310

update or redraw all attributes of nodes and links adds/removes new/deleted nodes

Parameters:

Name	Type	Description
graphData	VisualizationInputData

Returns: void

---

updateConfig

▸ updateConfig(newConfig: ConfigurationOptions | undefined): void

Defined in packages/core/src/GraphVisualization.ts:179

update config and re-render

Parameters:

Name	Type	Description
newConfig	ConfigurationOptions | undefined

Returns: void

---

updateGroups

▸ updateGroups(groups: DisplayGroup[]): void

Defined in packages/core/src/GraphVisualization.ts:379

updates only the groups mesh. Useful in situations that require ONLY display groups to update. E.g. toggling a group on or off when the nodes within a group have NOT changed.

Parameters:

Name	Type	Description
groups	DisplayGroup[]

Returns: void

---

updateNode

▸ updateNode(index: number, updatedNode: DisplayNode): void

Defined in packages/core/src/GraphVisualization.ts:360

update all the attributes of a single node at a given index

Parameters:

Name	Type	Description
index	number	-
updatedNode	DisplayNode

Returns: void

---

updatePositions

▸ updatePositions(updatedGraphData: VisualizationInputData): void

Defined in packages/core/src/GraphVisualization.ts:329

update only the position attributes of existing nodes and links.

This function assumes that the nodeIdToIndexMap is up to date and that the updatedGraphData hasn't changed in size or order and only the position attributes have changed within each node datum.

Parameters:

Name	Type	Description
updatedGraphData	VisualizationInputData

Returns: void

---

zoom

▸ zoom(factor: number): void

Defined in packages/core/src/GraphVisualization.ts:427

public method to zoom the graph

Parameters:

Name	Type	Default	Description
factor	number	0

Returns: void

---

Private zoomToFit

▸ zoomToFit(graphData: VisualizationInputData): void

Defined in packages/core/src/GraphVisualization.ts:445

Parameters:

Name	Type
graphData	VisualizationInputData

Returns: void