Sigma.js Utils
Various helper functions & classes used throughout the library.
Interfaces
Type Aliases
Easing
Ƭ Easing: keyof typeof easings
| (k
: number
) => number
Defaults.
Defined in
Variables
ANIMATE_DEFAULTS
• Const
ANIMATE_DEFAULTS: Object
Type declaration
Name | Type |
---|---|
duration | number |
easing | string |
Defined in
HTML_COLORS
• Const
HTML_COLORS: Record
<string
, string
>
Defined in
easings
• Const
easings: Object
Index signature
▪ [key: string
]: (k
: number
) => number
Defined in
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
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
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
colorToArray
▸ colorToArray(val
, masking?
): [number
, number
, number
, number
]
Parameters
Name | Type |
---|---|
val | string |
masking? | boolean |
Returns
[number
, number
, number
, number
]
Defined in
colorToIndex
▸ colorToIndex(r
, g
, b
, _a
): number
Parameters
Name | Type |
---|---|
r | number |
g | number |
b | number |
_a | number |
Returns
number
Defined in
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
createNormalizationFunction
▸ createNormalizationFunction(extent
): NormalizationFunction
Parameters
Name | Type |
---|---|
extent | Object |
extent.x | Extent |
extent.y | Extent |
Returns
Defined in
sigma/src/utils/normalization.ts:12
cubicIn
▸ cubicIn(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
cubicInOut
▸ cubicInOut(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
cubicOut
▸ cubicOut(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
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
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
floatColor
▸ floatColor(val
): number
Parameters
Name | Type |
---|---|
val | string |
Returns
number
Defined in
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 asM * 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
getPixelRatio
▸ getPixelRatio(): number
Function returning the browser's pixel ratio.
Returns
number
Defined in
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
identity
▸ identity(): Float32Array
Returns
Float32Array
Defined in
indexToColor
▸ indexToColor(index
): number
Parameters
Name | Type |
---|---|
index | number |
Returns
number
Defined in
isPlainObject
▸ isPlainObject(value
): boolean
Checks whether the given value is a plain object.
Parameters
Name | Type |
---|---|
value | unknown |
Returns
boolean
Defined in
linear
▸ linear(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
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
quadraticIn
▸ quadraticIn(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
quadraticInOut
▸ quadraticInOut(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
quadraticOut
▸ quadraticOut(k
): number
Parameters
Name | Type |
---|---|
k | number |
Returns
number
Defined in
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
rotate
▸ rotate(m
, r
): Float32Array
Parameters
Name | Type |
---|---|
m | Float32Array |
r | number |