Sigma.js Utils

Various helper functions & classes used throughout the library.

Interfaces

• AnimateOptions
• NormalizationFunction

Type Aliases

Easing

Ƭ Easing: keyof typeof easings | (k: number) => number

Defaults.

Defined in

sigma/src/utils/animate.ts:9

Variables

ANIMATE_DEFAULTS

• Const ANIMATE_DEFAULTS: Object

Type declaration

Name	Type
duration	number
easing	string

Defined in

sigma/src/utils/animate.ts:15

---

HTML_COLORS

• Const HTML_COLORS: Record<string, string>

Defined in

sigma/src/utils/colors.ts:1

---

easings

• Const easings: Object

Index signature

▪ [key: string]: (k: number) => number

Defined in

sigma/src/utils/easings.ts:21

Functions

animateNodes

▸ animateNodes(graph, targets, opts, callback?): () => void

Function used to animate the nodes.

Parameters

Name	Type
graph	AbstractGraph<Attributes, Attributes, Attributes>
targets	PlainObject<PlainObject<number>>
opts	Partial<AnimateOptions>
callback?	() => void

Returns

fn

▸ (): void

Returns

void

Defined in

sigma/src/utils/animate.ts:23

---

assign

▸ assign<T>(target, ...objects): T

Helper to use Object.assign with more than two objects.

Type parameters

Name
T

Parameters

Name	Type
target	undefined | Partial<T>
...objects	Partial<undefined | T>[]

Returns

T

Defined in

sigma/src/utils/data.ts:30

---

assignDeep

▸ assignDeep<T>(target, ...objects): T

Very simple recursive Object.assign like function.

Type parameters

Name
T

Parameters

Name	Type
target	undefined | Partial<T>
...objects	Partial<undefined | T>[]

Returns

T

Defined in

sigma/src/utils/data.ts:47

---

colorToArray

▸ colorToArray(val, masking?): [number, number, number, number]

Parameters

Name	Type
val	string
masking?	boolean

Returns

[number, number, number, number]

Defined in

sigma/src/utils/colors.ts:243

---

colorToIndex

▸ colorToIndex(r, g, b, _a): number

Parameters

Name	Type
r	number
g	number
b	number
_a	number

Returns

number

Defined in

sigma/src/utils/colors.ts:283

---

createElement

▸ createElement<T>(tag, style?, attributes?): T

Function used to create DOM elements easily.

Type parameters

Name	Type
T	extends HTMLElement

Parameters

Name	Type
tag	string
style?	Partial<CSSStyleDeclaration>
attributes?	PlainObject<string>

Returns

T

Defined in

sigma/src/utils/misc.ts:6

---

createNormalizationFunction

▸ createNormalizationFunction(extent): NormalizationFunction

Parameters

Name	Type
extent	Object
extent.x	Extent
extent.y	Extent

Returns

NormalizationFunction

Defined in

sigma/src/utils/normalization.ts:12

---

cubicIn

▸ cubicIn(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:12

---

cubicInOut

▸ cubicInOut(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:16

---

cubicOut

▸ cubicOut(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:14

---

extend

▸ extend<T>(array, values): void

Extends the target array with the given values.

Type parameters

Name
T

Parameters

Name	Type
array	T[]
values	Set<T>

Returns

void

Defined in

sigma/src/utils/data.ts:4

---

extractPixel

▸ extractPixel(gl, x, y, array): Uint8Array

Function extracting the color at the given pixel.

Parameters

Name	Type
gl	WebGLRenderingContext
x	number
y	number
array	Uint8Array

Returns

Uint8Array

Defined in

sigma/src/utils/colors.ts:155

---

floatColor

▸ floatColor(val): number

Parameters

Name	Type
val	string

Returns

number

Defined in

sigma/src/utils/colors.ts:225

---

getCorrectionRatio

▸ getCorrectionRatio(viewportDimensions, graphDimensions): number

In sigma, the graph is normalized into a [0, 1], [0, 1] square, before being given to the various renderers. This helps to deal with quadtree in particular. But at some point, we need to rescale it so that it takes the best place in the screen, i.e. we always want to see two nodes "touching" opposite sides of the graph, with the camera being at its default state.

This function determines this ratio.

Parameters

Name	Type
viewportDimensions	Object
viewportDimensions.height	number
viewportDimensions.width	number
graphDimensions	Object
graphDimensions.height	number
graphDimensions.width	number

Returns

number

Defined in

sigma/src/utils/coordinates.ts:12

---

getMatrixImpact

▸ getMatrixImpact(matrix, cameraState, viewportDimensions): number

All these transformations we apply on the matrix to get it rescale the graph as we want make it very hard to get pixel-perfect distances in WebGL. This function returns a factor that properly cancels the matrix effect on lengths.

[jacomyal] To be fully honest, I can't really explain happens here... I notice that the following ratio works (i.e. it correctly compensates the matrix impact on all camera states I could try):

R = size(V) / size(M * V) / W as long as M * V is in the direction of W (ie. parallel to (Ox)). It works as well with H and a vector that transforms into something parallel to (Oy).

Also, note that we use angle and not -angle (that would seem logical, since we want to anticipate the rotation), because the image is vertically swapped in WebGL.

Parameters

Name	Type
matrix	Float32Array
cameraState	CameraState
viewportDimensions	Dimensions

Returns

number

Defined in

sigma/src/utils/coordinates.ts:98

---

getPixelColor

▸ getPixelColor(gl, frameBuffer, x, y, pixelRatio, downSizingRatio): [number, number, number, number]

Parameters

Name	Type
gl	WebGLRenderingContext
frameBuffer	null | WebGLBuffer
x	number
y	number
pixelRatio	number
downSizingRatio	number

Returns

[number, number, number, number]

Defined in

sigma/src/utils/colors.ts:292

---

getPixelRatio

▸ getPixelRatio(): number

Function returning the browser's pixel ratio.

Returns

number

Defined in

sigma/src/utils/misc.ts:31

---

graphExtent

▸ graphExtent(graph): Object

Function returning the graph's node extent in x & y.

Parameters

Name	Type
graph	AbstractGraph<Attributes, Attributes, Attributes>

Returns

Object

Name	Type
x	Extent
y	Extent

Defined in

sigma/src/utils/graph.ts:9

---

identity

▸ identity(): Float32Array

Returns

Float32Array

Defined in

sigma/src/utils/matrices.ts:3

---

indexToColor

▸ indexToColor(index): number

Parameters

Name	Type
index	number

Returns

number

Defined in

sigma/src/utils/colors.ts:260

---

isPlainObject

▸ isPlainObject(value): boolean

Checks whether the given value is a plain object.

Parameters

Name	Type
value	unknown

Returns

boolean

Defined in

sigma/src/utils/data.ts:23

---

linear

▸ linear(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:1

---

matrixFromCamera

▸ matrixFromCamera(state, viewportDimensions, graphDimensions, padding, inverse?): Float32Array

Function returning a matrix from the current state of the camera.

Parameters

Name	Type
state	CameraState
viewportDimensions	Object
viewportDimensions.height	number
viewportDimensions.width	number
graphDimensions	Object
graphDimensions.height	number
graphDimensions.width	number
padding	number
inverse?	boolean

Returns

Float32Array

Defined in

sigma/src/utils/coordinates.ts:34

---

multiply

▸ multiply<T>(a, b): T

Type parameters

Name	Type
T	extends number[] | Float32Array

Parameters

Name	Type
a	T
b	number[] | Float32Array

Returns

T

Defined in

sigma/src/utils/matrices.ts:34

---

multiplyVec2

▸ multiplyVec2(a, b, z?): Coordinates

Parameters

Name	Type	Default value
a	number[] | Float32Array	undefined
b	Coordinates	undefined
z	number	1

Returns

Coordinates

Defined in

sigma/src/utils/matrices.ts:70

---

parseColor

▸ parseColor(val): RGBAColor

Parameters

Name	Type
val	string

Returns

RGBAColor

Defined in

sigma/src/utils/colors.ts:176

---

quadraticIn

▸ quadraticIn(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:3

---

quadraticInOut

▸ quadraticInOut(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:7

---

quadraticOut

▸ quadraticOut(k): number

Parameters

Name	Type
k	number

Returns

number

Defined in

sigma/src/utils/easings.ts:5

---

rgbaToFloat

▸ rgbaToFloat(r, g, b, a, masking?): number

Parameters

Name	Type
r	number
g	number
b	number
a	number
masking?	boolean

Returns

number

Defined in

sigma/src/utils/colors.ts:220

---

rotate

▸ rotate(m, r): Float32Array

Parameters

Name	Type
m	Float32Array
r	number

Returns

Float32Array

Defined in

sigma/src/utils/matrices.ts:15

---

scale

▸ scale(m, x, y?): Float32Array

Parameters

Name	Type
m	Float32Array
x	number
y?	number

Returns

Float32Array

Defined in

sigma/src/utils/matrices.ts:8

---

translate

▸ translate(m, x, y): Float32Array

Parameters

Name	Type
m	Float32Array
x	number
y	number

Returns

Float32Array

Defined in

sigma/src/utils/matrices.ts:27

---

validateGraph

▸ validateGraph(graph): void

Check if the graph variable is a valid graph, and if sigma can render it.

Parameters

Name	Type
graph	AbstractGraph<Attributes, Attributes, Attributes>

Returns

void

Defined in

sigma/src/utils/graph.ts:33

---

zIndexOrdering

▸ zIndexOrdering<T>(_extent, getter, elements): T[]

Function ordering the given elements in reverse z-order so they drawn the correct way.

Type parameters

Name
T

Parameters

Name	Type
_extent	Extent
getter	(e: T) => number
elements	T[]

Returns

T[]

Defined in

sigma/src/utils/misc.ts:41