@neo4j-nvl/base 2.0.0-c8e499dc → 2.0.0-ec6fdba7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -0
- package/dist/base.mjs +1062 -1058
- package/dist/types/index.d.ts +382 -385
- package/dist/types/layouts/animatedlayout/AnimatedLayout.d.ts +23 -23
- package/dist/types/layouts/animatedlayout/animationUtils.d.ts +3 -3
- package/dist/types/layouts/circularLayout/CircularLayout.d.ts +14 -14
- package/dist/types/layouts/d3forcelayout/circularLayout.d.ts +4 -4
- package/dist/types/layouts/d3forcelayout/constants.d.ts +3 -3
- package/dist/types/layouts/d3forcelayout/d3ForceLayout.d.ts +31 -31
- package/dist/types/layouts/d3forcelayout/types.d.ts +7 -7
- package/dist/types/layouts/forcedirectedlayout/PhysLayout.d.ts +261 -261
- package/dist/types/layouts/forcedirectedlayout/clustering/ClusterByMerger.d.ts +52 -52
- package/dist/types/layouts/forcedirectedlayout/clustering/SolarMerger.d.ts +49 -49
- package/dist/types/layouts/forcedirectedlayout/clustering/clustering-utils.d.ts +35 -35
- package/dist/types/layouts/forcedirectedlayout/clustering/types.d.ts +39 -39
- package/dist/types/layouts/forcedirectedlayout/glwrapper.d.ts +3 -3
- package/dist/types/layouts/forcedirectedlayout/shaders/multilevel-fragment.d.ts +1 -1
- package/dist/types/layouts/forcedirectedlayout/shaders/multilevel-repulsive-fragment.d.ts +1 -1
- package/dist/types/layouts/forcedirectedlayout/shaders/multilevel-update-fragment.d.ts +1 -1
- package/dist/types/layouts/forcedirectedlayout/shaders/sim-vertex.d.ts +1 -1
- package/dist/types/layouts/freeLayout/FreeLayout.d.ts +23 -23
- package/dist/types/layouts/gridLayout/GridLayout.d.ts +26 -26
- package/dist/types/layouts/hierarchicallayout/HierarchicalLayout.d.ts +28 -28
- package/dist/types/layouts/hierarchicallayout/constants.d.ts +2 -2
- package/dist/types/modules/CallbackHelper.d.ts +23 -23
- package/dist/types/modules/ExternalCallbackHandler.d.ts +33 -33
- package/dist/types/modules/NvlController.d.ts +212 -209
- package/dist/types/modules/Shader.d.ts +17 -17
- package/dist/types/modules/ZoomTransitionHandler.d.ts +24 -24
- package/dist/types/modules/dataset.d.ts +24 -24
- package/dist/types/modules/logging.d.ts +4 -4
- package/dist/types/modules/state/constants.d.ts +2 -2
- package/dist/types/modules/state/state.d.ts +2 -2
- package/dist/types/modules/state/types.d.ts +296 -288
- package/dist/types/modules/state/utils.d.ts +36 -36
- package/dist/types/renderers/ClusterOverlay.d.ts +67 -67
- package/dist/types/renderers/domrenderer/BaseRenderer.d.ts +69 -69
- package/dist/types/renderers/domrenderer/canvasrenderer/Animation.d.ts +57 -57
- package/dist/types/renderers/domrenderer/canvasrenderer/AnimationHandler.d.ts +65 -65
- package/dist/types/renderers/domrenderer/canvasrenderer/CanvasRenderer.d.ts +84 -85
- package/dist/types/renderers/domrenderer/canvasrenderer/arrowDrawing.d.ts +31 -31
- package/dist/types/renderers/domrenderer/canvasrenderer/nodeDrawing.d.ts +32 -32
- package/dist/types/renderers/domrenderer/shared/ImageCache.d.ts +16 -16
- package/dist/types/renderers/domrenderer/shared/arrows/ArrowBundle.d.ts +89 -89
- package/dist/types/renderers/domrenderer/shared/arrows/ArrowBundler.d.ts +42 -42
- package/dist/types/renderers/domrenderer/shared/arrows/arrows.d.ts +49 -49
- package/dist/types/renderers/domrenderer/shared/arrows/constants.d.ts +4 -4
- package/dist/types/renderers/domrenderer/shared/nodes/nodes.d.ts +21 -21
- package/dist/types/renderers/domrenderer/shared/types.d.ts +29 -29
- package/dist/types/renderers/domrenderer/shared/util.d.ts +4 -4
- package/dist/types/renderers/domrenderer/shared/vectorUtils.d.ts +10 -10
- package/dist/types/renderers/domrenderer/shared/wordwrap.d.ts +10 -10
- package/dist/types/renderers/domrenderer/svgrenderer/SvgRenderer.d.ts +18 -19
- package/dist/types/renderers/domrenderer/svgrenderer/arrowDrawing.d.ts +15 -15
- package/dist/types/renderers/domrenderer/svgrenderer/nodeDrawing.d.ts +4 -4
- package/dist/types/renderers/domrenderer/svgrenderer/svgUtils.d.ts +21 -21
- package/dist/types/renderers/webglrenderer/Controller.d.ts +83 -82
- package/dist/types/renderers/webglrenderer/IconLayerRegistry.d.ts +8 -8
- package/dist/types/renderers/webglrenderer/Renderer.d.ts +89 -89
- package/dist/types/renderers/webglrenderer/node-animation-fragment.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/node-animation-vertex.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/node-fragment-point.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/node-vertex-point.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/rel-fragment-line.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/rel-glsl-utils.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/rel-vertex-arrow.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/rel-vertex-line.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/viewport-box-fragment.d.ts +1 -1
- package/dist/types/renderers/webglrenderer/viewport-box-vertex.d.ts +1 -1
- package/dist/types/types/graph-element.d.ts +103 -103
- package/dist/types/types/nvl-window-functions.d.ts +12 -13
- package/dist/types/types/utils.d.ts +1 -1
- package/dist/types/utils/ariaUtils.d.ts +2 -2
- package/dist/types/utils/canvasManagement.d.ts +1 -1
- package/dist/types/utils/circularUtils.d.ts +2 -2
- package/dist/types/utils/clusterGeometry.d.ts +3 -3
- package/dist/types/utils/clusterHitRegions.d.ts +12 -12
- package/dist/types/utils/colorUtils.d.ts +2 -2
- package/dist/types/utils/constants.d.ts +6 -6
- package/dist/types/utils/errors.d.ts +6 -6
- package/dist/types/utils/geometry.d.ts +48 -48
- package/dist/types/utils/graphObjectUtils.d.ts +9 -9
- package/dist/types/utils/hitTest.d.ts +47 -47
- package/dist/types/utils/jsDriverResultTransformer.d.ts +16 -16
- package/dist/types/utils/layoutSeeding.d.ts +2 -2
- package/dist/types/utils/mouseUtils.d.ts +5 -5
- package/dist/types/utils/segmentAnalytics.d.ts +42 -42
- package/dist/types/utils/webWorkerUtils.d.ts +1 -1
- package/dist/types/utils/zoomFunctions.d.ts +16 -15
- package/package.json +12 -10
- package/skills/neo4j-nvl-skill/SKILL.md +238 -398
- package/skills/neo4j-nvl-skill/references/api/base/classes/NVL.md +977 -0
- package/skills/neo4j-nvl-skill/references/api/base/functions/getZoomTargetForNodePositions.md +37 -0
- package/skills/neo4j-nvl-skill/references/api/base/index.md +71 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/CircularOptions.md +11 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/ClusteringOptions.md +14 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/ExternalCallbacks.md +18 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/ForceDirectedOptions.md +12 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/HierarchicalOptions.md +13 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/HitTargetCluster.md +13 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/HitTargetNode.md +16 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/HitTargetRelationship.md +15 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/Node.md +32 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/NvlMouseEvent.md +16 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/NvlOptions.md +38 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/Point.md +12 -0
- package/skills/neo4j-nvl-skill/references/api/base/interfaces/Relationship.md +32 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/CanvasRendererType.md +14 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/Cluster.md +20 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/ClusterByFn.md +20 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/ClusterId.md +10 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/HitTargets.md +22 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/HitTestTarget.md +7 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/Layout.md +15 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/LayoutOptions.md +12 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/NodeWithClientPosition.md +18 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/PartialNode.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/PartialRelationship.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/Renderer.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/StyledCaption.md +21 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/WebGLRendererType.md +14 -0
- package/skills/neo4j-nvl-skill/references/api/base/type-aliases/ZoomOptions.md +25 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/CircularLayoutType.md +11 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/ForceDirectedLayoutType.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/FreeLayoutType.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/GridLayoutType.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/HierarchicalLayoutType.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/d3ForceLayoutType.md +9 -0
- package/skills/neo4j-nvl-skill/references/api/base/variables/nvlResultTransformer.md +38 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/BoxSelectInteraction.md +163 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/ClickInteraction.md +163 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/DragNodeInteraction.md +164 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/HoverInteraction.md +160 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/KeyboardInteraction.md +185 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/LassoInteraction.md +163 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/PanInteraction.md +196 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/classes/ZoomInteraction.md +164 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/index.md +37 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/BoxSelectInteractionCallbacks.md +19 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/BoxSelectInteractionOptions.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/ClickInteractionCallbacks.md +39 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/ClickInteractionOptions.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/DragNodeInteractionCallbacks.md +21 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/DrawInteractionOptions.md +22 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/HoverInteractionCallbacks.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/HoverInteractionOptions.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/KeyboardInteractionCallbacks.md +35 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/KeyboardInteractionOptions.md +55 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/LassoInteractionCallbacks.md +19 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/LassoInteractionOptions.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/PanInteractionCallbacks.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/PanInteractionOptions.md +19 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/ZoomInteractionCallbacks.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/interaction-handlers/type-aliases/ZoomInteractionOptions.md +17 -0
- package/skills/neo4j-nvl-skill/references/api/react/functions/StaticPictureWrapper.md +35 -0
- package/skills/neo4j-nvl-skill/references/api/react/index.md +34 -0
- package/skills/neo4j-nvl-skill/references/api/react/interfaces/BasicReactWrapperProps.md +24 -0
- package/skills/neo4j-nvl-skill/references/api/react/interfaces/InteractiveNvlWrapperProps.md +27 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/InteractionOptions.md +10 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/KeyboardEvent.md +7 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/KeyboardEventCallbacks.md +10 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/MouseEvent.md +10 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/MouseEventCallbacks.md +10 -0
- package/skills/neo4j-nvl-skill/references/api/react/type-aliases/StaticPictureWrapperProps.md +27 -0
- package/skills/neo4j-nvl-skill/references/api/react/variables/BasicNvlWrapper.md +50 -0
- package/skills/neo4j-nvl-skill/references/api/react/variables/InteractiveNvlWrapper.md +17 -0
- package/skills/neo4j-nvl-skill/references/clustering.md +87 -0
- package/skills/neo4j-nvl-skill/references/data-from-neo4j.md +67 -0
- package/skills/neo4j-nvl-skill/references/labels-and-overlays.md +76 -0
- package/skills/neo4j-nvl-skill/references/layouts-and-positions.md +65 -0
- package/skills/neo4j-nvl-skill/references/lifecycle-and-updates.md +65 -0
- package/skills/neo4j-nvl-skill/references/migrating-1x-to-2.md +50 -0
- package/skills/neo4j-nvl-skill/references/react-wrappers.md +88 -0
- package/skills/neo4j-nvl-skill/references/verifying-nvl-apps.md +52 -0
- package/skills/neo4j-nvl-skill/references/vite-and-bundlers.md +62 -0
- package/dist/types/layouts/animatedlayout/AnimatedLayout.test.d.ts +0 -1
- package/dist/types/layouts/animatedlayout/animationUtils.test.d.ts +0 -1
- package/dist/types/layouts/d3forcelayout/__mocks__/d3ForceLayout.d.ts +0 -10
- package/dist/types/layouts/d3forcelayout/circularLayout.test.d.ts +0 -1
- package/dist/types/layouts/d3forcelayout/d3ForceLayout.test.d.ts +0 -1
- package/dist/types/layouts/forcedirectedlayout/PhysLayout.test.d.ts +0 -1
- package/dist/types/layouts/forcedirectedlayout/clustering/ClusterByMerger.test.d.ts +0 -1
- package/dist/types/layouts/forcedirectedlayout/clustering/SolarMerger.bench.d.ts +0 -1
- package/dist/types/layouts/forcedirectedlayout/clustering/SolarMerger.test.d.ts +0 -1
- package/dist/types/layouts/forcedirectedlayout/clustering/clustering-utils.test.d.ts +0 -1
- package/dist/types/modules/NvlController.test.d.ts +0 -1
- package/dist/types/modules/ZoomTransitionHandler.test.d.ts +0 -1
- package/dist/types/modules/dataset.test.d.ts +0 -1
- package/dist/types/modules/state/state.test.d.ts +0 -1
- package/dist/types/modules/state/utils.test.d.ts +0 -1
- package/dist/types/renderers/ClusterOverlay.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/BaseRenderer.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/canvasrenderer/Animation.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/canvasrenderer/CanvasRenderer.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/canvasrenderer/arrowDrawing.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/canvasrenderer/nodeDrawing.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/ImageCache.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/arrows/ArrowBundle.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/arrows/ArrowBundler.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/arrows/arrows.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/nodes/nodes.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/util.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/shared/wordwrap.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/svgrenderer/SvgRenderer.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/svgrenderer/arrowDrawing.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/svgrenderer/nodeDrawing.test.d.ts +0 -1
- package/dist/types/renderers/domrenderer/svgrenderer/svgUtils.test.d.ts +0 -1
- package/dist/types/renderers/webglrenderer/Controller.test.d.ts +0 -1
- package/dist/types/renderers/webglrenderer/IconLayerRegistry.test.d.ts +0 -1
- package/dist/types/renderers/webglrenderer/Renderer.test.d.ts +0 -1
- package/dist/types/utils/ariaUtils.test.d.ts +0 -1
- package/dist/types/utils/canvasManagement.test.d.ts +0 -1
- package/dist/types/utils/circularUtils.test.d.ts +0 -1
- package/dist/types/utils/clusterGeometry.test.d.ts +0 -1
- package/dist/types/utils/clusterHitRegions.test.d.ts +0 -1
- package/dist/types/utils/colorUtils.test.d.ts +0 -1
- package/dist/types/utils/errors.test.d.ts +0 -1
- package/dist/types/utils/geometry.test.d.ts +0 -1
- package/dist/types/utils/graphObjectUtils.test.d.ts +0 -1
- package/dist/types/utils/hitTest.test.d.ts +0 -1
- package/dist/types/utils/jsDriverResultTransformer.test.d.ts +0 -1
- package/dist/types/utils/layoutSeeding.test.d.ts +0 -1
- package/dist/types/utils/mouseUtils.test.d.ts +0 -1
- package/dist/types/utils/webWorkerUtils.test.d.ts +0 -1
- package/dist/types/utils/zoomFunctions.test.d.ts +0 -1
- package/skills/neo4j-nvl-skill/references/api-surface.md +0 -596
- package/skills/neo4j-nvl-skill/references/troubleshooting.md +0 -317
|
@@ -0,0 +1,977 @@
|
|
|
1
|
+
[//]: # (This file is auto-generated by scripts/docs/generate-skills.mjs, do not edit it manually)
|
|
2
|
+
|
|
3
|
+
# Class: NVL
|
|
4
|
+
|
|
5
|
+
Class for a NVL instance.
|
|
6
|
+
|
|
7
|
+
## Example
|
|
8
|
+
|
|
9
|
+
This is a basic setup for a NVL instance.
|
|
10
|
+
```ts
|
|
11
|
+
import { NVL } from '@neo4j-nvl/base'
|
|
12
|
+
|
|
13
|
+
const nodes = [{ id: '1' }, { id: '2' }]
|
|
14
|
+
const relationships = [{ id: '12', from: '1', to: '2' }]
|
|
15
|
+
|
|
16
|
+
const options = { initialZoom: 0.5 }
|
|
17
|
+
|
|
18
|
+
const callbacks = {
|
|
19
|
+
onLayoutDone: () => console.log('Layout done')
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
const nvl = new NVL(document.getElementById('frame'), nodes, relationships, options, callbacks)
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Constructors
|
|
26
|
+
|
|
27
|
+
### Constructor
|
|
28
|
+
|
|
29
|
+
```ts
|
|
30
|
+
new NVL(
|
|
31
|
+
frame,
|
|
32
|
+
nvlNodes?,
|
|
33
|
+
nvlRels?,
|
|
34
|
+
options?,
|
|
35
|
+
callbacks?
|
|
36
|
+
): NVL;
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
Creates a new NVL instance.
|
|
40
|
+
|
|
41
|
+
#### Parameters
|
|
42
|
+
|
|
43
|
+
| Parameter | Type | Default value | Description |
|
|
44
|
+
| ------ | ------ | ------ | ------ |
|
|
45
|
+
| `frame` | `HTMLElement` | `undefined` | The DOM element to display the graph in. |
|
|
46
|
+
| `nvlNodes` | [`Node`](../interfaces/Node.md)[] | `[]` | An array of [nodes](../interfaces/Node.md). |
|
|
47
|
+
| `nvlRels` | [`Relationship`](../interfaces/Relationship.md)[] | `[]` | An array of [relationships](../interfaces/Relationship.md). |
|
|
48
|
+
| `options` | [`NvlOptions`](../interfaces/NvlOptions.md) | `{}` | The [options](../interfaces/NvlOptions.md) for the NVL instance. |
|
|
49
|
+
| `callbacks` | [`ExternalCallbacks`](../interfaces/ExternalCallbacks.md) | `{}` | Callbacks triggered on NVL events. |
|
|
50
|
+
|
|
51
|
+
#### Returns
|
|
52
|
+
|
|
53
|
+
`NVL`
|
|
54
|
+
|
|
55
|
+
## Methods
|
|
56
|
+
|
|
57
|
+
### addAndUpdateElementsInGraph()
|
|
58
|
+
|
|
59
|
+
```ts
|
|
60
|
+
addAndUpdateElementsInGraph(nodes?, relationships?): void;
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
Adds nodes and relationships to NVL and updates existing nodes and relationships.
|
|
64
|
+
|
|
65
|
+
#### Parameters
|
|
66
|
+
|
|
67
|
+
| Parameter | Type | Default value | Description |
|
|
68
|
+
| ------ | ------ | ------ | ------ |
|
|
69
|
+
| `nodes` | \| [`Node`](../interfaces/Node.md)[] \| [`PartialNode`](../type-aliases/PartialNode.md)[] | `[]` | An Array of [nodes](../interfaces/Node.md) to be added or updated. |
|
|
70
|
+
| `relationships` | \| [`Relationship`](../interfaces/Relationship.md)[] \| [`PartialRelationship`](../type-aliases/PartialRelationship.md)[] | `[]` | An Array of [relationships](../interfaces/Relationship.md) to be added or updated. To update nodes or relationships, they must have an id that matches the id of the node or relationship to be updated. Only the properties that are provided will be updated. If an existing property is not provided, it will not be changed. |
|
|
71
|
+
|
|
72
|
+
#### Returns
|
|
73
|
+
|
|
74
|
+
`void`
|
|
75
|
+
|
|
76
|
+
#### Example
|
|
77
|
+
|
|
78
|
+
Adding and updating nodes and relationships
|
|
79
|
+
```ts
|
|
80
|
+
import { NVL } from '@neo4j-nvl/base'
|
|
81
|
+
|
|
82
|
+
const nvl = new NVL(document.getElementById('frame'), [{ id: '0' }], [])
|
|
83
|
+
|
|
84
|
+
const nodes = [
|
|
85
|
+
{ id: '1', label: 'Node 1', color: '#e04141' },
|
|
86
|
+
{ id: '2', label: 'Node 2', color: '#e09c41' }
|
|
87
|
+
]
|
|
88
|
+
const relationships = [
|
|
89
|
+
{ id: '12', from: '1', to: '2' }
|
|
90
|
+
]
|
|
91
|
+
// Adds new nodes and relationships
|
|
92
|
+
nvl.addAndUpdateElementsInGraph(nodes, relationships)
|
|
93
|
+
// Updates an existing relationship
|
|
94
|
+
nvl.addAndUpdateElementsInGraph([], [{ id: '12', color: '#e0df41' }])
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
***
|
|
98
|
+
|
|
99
|
+
### addElementsToGraph()
|
|
100
|
+
|
|
101
|
+
```ts
|
|
102
|
+
addElementsToGraph(nodes, relationships): void;
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
Adds nodes and relationships in the current scene.
|
|
106
|
+
|
|
107
|
+
#### Parameters
|
|
108
|
+
|
|
109
|
+
| Parameter | Type | Description |
|
|
110
|
+
| ------ | ------ | ------ |
|
|
111
|
+
| `nodes` | [`Node`](../interfaces/Node.md)[] | The nodes to be added. |
|
|
112
|
+
| `relationships` | [`Relationship`](../interfaces/Relationship.md)[] | The relationships to be added. |
|
|
113
|
+
|
|
114
|
+
#### Returns
|
|
115
|
+
|
|
116
|
+
`void`
|
|
117
|
+
|
|
118
|
+
***
|
|
119
|
+
|
|
120
|
+
### deselectAll()
|
|
121
|
+
|
|
122
|
+
```ts
|
|
123
|
+
deselectAll(): void;
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
De-selects all nodes and relationships.
|
|
127
|
+
|
|
128
|
+
#### Returns
|
|
129
|
+
|
|
130
|
+
`void`
|
|
131
|
+
|
|
132
|
+
***
|
|
133
|
+
|
|
134
|
+
### destroy()
|
|
135
|
+
|
|
136
|
+
```ts
|
|
137
|
+
destroy(): void;
|
|
138
|
+
```
|
|
139
|
+
|
|
140
|
+
Removes the graph visualization from the DOM and cleans up everything.
|
|
141
|
+
|
|
142
|
+
#### Returns
|
|
143
|
+
|
|
144
|
+
`void`
|
|
145
|
+
|
|
146
|
+
***
|
|
147
|
+
|
|
148
|
+
### fit()
|
|
149
|
+
|
|
150
|
+
```ts
|
|
151
|
+
fit(nodeIds, zoomOptions?): void;
|
|
152
|
+
```
|
|
153
|
+
|
|
154
|
+
Updates pan and zoom to fit the specified nodes in the viewport.
|
|
155
|
+
|
|
156
|
+
#### Parameters
|
|
157
|
+
|
|
158
|
+
| Parameter | Type | Description |
|
|
159
|
+
| ------ | ------ | ------ |
|
|
160
|
+
| `nodeIds` | `string`[] | The ids of the nodes to fit on the screen. |
|
|
161
|
+
| `zoomOptions?` | [`ZoomOptions`](../type-aliases/ZoomOptions.md) | Specific options on how to transition the zoom. |
|
|
162
|
+
|
|
163
|
+
#### Returns
|
|
164
|
+
|
|
165
|
+
`void`
|
|
166
|
+
|
|
167
|
+
#### Remarks
|
|
168
|
+
|
|
169
|
+
Zoom is limited by [ZoomOptions.minZoom](../type-aliases/ZoomOptions.md#minzoom) / [ZoomOptions.maxZoom](../type-aliases/ZoomOptions.md#maxzoom) and the
|
|
170
|
+
[minZoom](../interfaces/NvlOptions.md#minzoom) / [maxZoom](../interfaces/NvlOptions.md#maxzoom) /
|
|
171
|
+
[allowDynamicMinZoom](../interfaces/NvlOptions.md#allowdynamicminzoom) options. See those for details.
|
|
172
|
+
|
|
173
|
+
***
|
|
174
|
+
|
|
175
|
+
### getContainer()
|
|
176
|
+
|
|
177
|
+
```ts
|
|
178
|
+
getContainer(): HTMLElement;
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
Provides the container DOM element the graph is rendered in.
|
|
182
|
+
|
|
183
|
+
#### Returns
|
|
184
|
+
|
|
185
|
+
`HTMLElement`
|
|
186
|
+
|
|
187
|
+
The container element of the NVL instance.
|
|
188
|
+
|
|
189
|
+
***
|
|
190
|
+
|
|
191
|
+
### getCurrentOptions()
|
|
192
|
+
|
|
193
|
+
```ts
|
|
194
|
+
getCurrentOptions(): NvlOptions;
|
|
195
|
+
```
|
|
196
|
+
|
|
197
|
+
Returns the current options.
|
|
198
|
+
|
|
199
|
+
#### Returns
|
|
200
|
+
|
|
201
|
+
[`NvlOptions`](../interfaces/NvlOptions.md)
|
|
202
|
+
|
|
203
|
+
The current options.
|
|
204
|
+
|
|
205
|
+
***
|
|
206
|
+
|
|
207
|
+
### getHits()
|
|
208
|
+
|
|
209
|
+
```ts
|
|
210
|
+
getHits(
|
|
211
|
+
evt,
|
|
212
|
+
targets?,
|
|
213
|
+
hitOptions?
|
|
214
|
+
): NvlMouseEvent;
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
Gets the nodes, relationships, and clusters that have been hit by a pointer event.
|
|
218
|
+
|
|
219
|
+
#### Parameters
|
|
220
|
+
|
|
221
|
+
| Parameter | Type | Description |
|
|
222
|
+
| ------ | ------ | ------ |
|
|
223
|
+
| `evt` | `MouseEvent` | The mouse event. |
|
|
224
|
+
| `targets` | [`HitTestTarget`](../type-aliases/HitTestTarget.md)[] | The graph elements to check for hits. Defaults to ['node', 'relationship', 'cluster']. |
|
|
225
|
+
| `hitOptions` | \{ `hitNodeMarginWidth`: `number`; \} | Options for the hit test. |
|
|
226
|
+
| `hitOptions.hitNodeMarginWidth` | `number` | - |
|
|
227
|
+
|
|
228
|
+
#### Returns
|
|
229
|
+
|
|
230
|
+
[`NvlMouseEvent`](../interfaces/NvlMouseEvent.md)
|
|
231
|
+
|
|
232
|
+
A [NvlMouseEvent](../interfaces/NvlMouseEvent.md) with the [HitTargets](../type-aliases/HitTargets.md) property
|
|
233
|
+
containing the nodes, relationships, and clusters that have been hit by the pointer event.
|
|
234
|
+
|
|
235
|
+
#### Example
|
|
236
|
+
|
|
237
|
+
```js
|
|
238
|
+
const container = document.getElementById('frame')
|
|
239
|
+
const nvl = new NVL(container, [{ id: '0' }], [])
|
|
240
|
+
|
|
241
|
+
// Get the nodes and relationships that have been hit by a pointer event.
|
|
242
|
+
container?.addEventListener('click', (evt) => {
|
|
243
|
+
const { nvlTargets } = nvl.getHits(evt)
|
|
244
|
+
console.log('clicked elements:', nvlTargets)
|
|
245
|
+
})
|
|
246
|
+
```
|
|
247
|
+
|
|
248
|
+
***
|
|
249
|
+
|
|
250
|
+
### getImageDataUrl()
|
|
251
|
+
|
|
252
|
+
```ts
|
|
253
|
+
getImageDataUrl(options?): string;
|
|
254
|
+
```
|
|
255
|
+
|
|
256
|
+
Returns the current view of the graph visualization canvas as a data URL.
|
|
257
|
+
|
|
258
|
+
#### Parameters
|
|
259
|
+
|
|
260
|
+
| Parameter | Type | Description |
|
|
261
|
+
| ------ | ------ | ------ |
|
|
262
|
+
| `options` | \{ `backgroundColor?`: `string`; \} | The options for the image. |
|
|
263
|
+
| `options.backgroundColor?` | `string` | The background color of the data URL. |
|
|
264
|
+
|
|
265
|
+
#### Returns
|
|
266
|
+
|
|
267
|
+
`string`
|
|
268
|
+
|
|
269
|
+
A data URL of the current view of the graph visualization canvas.
|
|
270
|
+
|
|
271
|
+
***
|
|
272
|
+
|
|
273
|
+
### getNodeById()
|
|
274
|
+
|
|
275
|
+
```ts
|
|
276
|
+
getNodeById(id): Node;
|
|
277
|
+
```
|
|
278
|
+
|
|
279
|
+
Returns the node data that is currently stored in the visualisation for a given id.
|
|
280
|
+
|
|
281
|
+
#### Parameters
|
|
282
|
+
|
|
283
|
+
| Parameter | Type | Description |
|
|
284
|
+
| ------ | ------ | ------ |
|
|
285
|
+
| `id` | `string` | The id of the [node](../interfaces/Node.md) that should be returned. |
|
|
286
|
+
|
|
287
|
+
#### Returns
|
|
288
|
+
|
|
289
|
+
[`Node`](../interfaces/Node.md)
|
|
290
|
+
|
|
291
|
+
The [node](../interfaces/Node.md) or undefined if there is no node with the given id.
|
|
292
|
+
|
|
293
|
+
***
|
|
294
|
+
|
|
295
|
+
### getNodePositions()
|
|
296
|
+
|
|
297
|
+
```ts
|
|
298
|
+
getNodePositions(): Node & Point[];
|
|
299
|
+
```
|
|
300
|
+
|
|
301
|
+
Fetches and returns the current positions of all nodes as an array of coordinates.
|
|
302
|
+
|
|
303
|
+
#### Returns
|
|
304
|
+
|
|
305
|
+
[`Node`](../interfaces/Node.md) & [`Point`](../interfaces/Point.md)[]
|
|
306
|
+
|
|
307
|
+
An array of [node](../interfaces/Node.md) positions.
|
|
308
|
+
|
|
309
|
+
***
|
|
310
|
+
|
|
311
|
+
### getNodes()
|
|
312
|
+
|
|
313
|
+
```ts
|
|
314
|
+
getNodes(): NodeWithClientPosition[];
|
|
315
|
+
```
|
|
316
|
+
|
|
317
|
+
Returns all nodes that is currently stored in the visualisation.
|
|
318
|
+
Each node includes layout coordinates (`x`, `y`) and a `clientPosition` in screen space.
|
|
319
|
+
|
|
320
|
+
#### Returns
|
|
321
|
+
|
|
322
|
+
[`NodeWithClientPosition`](../type-aliases/NodeWithClientPosition.md)[]
|
|
323
|
+
|
|
324
|
+
The array of [nodes](../type-aliases/NodeWithClientPosition.md).
|
|
325
|
+
|
|
326
|
+
***
|
|
327
|
+
|
|
328
|
+
### getNodesOnScreen()
|
|
329
|
+
|
|
330
|
+
```ts
|
|
331
|
+
getNodesOnScreen(): {
|
|
332
|
+
nodes: Node[];
|
|
333
|
+
rels: Relationship[];
|
|
334
|
+
};
|
|
335
|
+
```
|
|
336
|
+
|
|
337
|
+
Returns the nodes that are currently in the visualization.
|
|
338
|
+
The `rels` property of the returned object is always empty.
|
|
339
|
+
|
|
340
|
+
#### Returns
|
|
341
|
+
|
|
342
|
+
An object containing the nodes and relationships in the visualization.
|
|
343
|
+
|
|
344
|
+
| Name | Type | Description |
|
|
345
|
+
| ------ | ------ | ------ |
|
|
346
|
+
| `nodes` | [`Node`](../interfaces/Node.md)[] | The nodes in the visualization. |
|
|
347
|
+
| `rels` | [`Relationship`](../interfaces/Relationship.md)[] | The relationships in the visualization. |
|
|
348
|
+
|
|
349
|
+
***
|
|
350
|
+
|
|
351
|
+
### getPan()
|
|
352
|
+
|
|
353
|
+
```ts
|
|
354
|
+
getPan(): Point;
|
|
355
|
+
```
|
|
356
|
+
|
|
357
|
+
Returns the current pan of the viewport.
|
|
358
|
+
|
|
359
|
+
#### Returns
|
|
360
|
+
|
|
361
|
+
[`Point`](../interfaces/Point.md)
|
|
362
|
+
|
|
363
|
+
The current pan of the viewport.
|
|
364
|
+
|
|
365
|
+
***
|
|
366
|
+
|
|
367
|
+
### getPositionById()
|
|
368
|
+
|
|
369
|
+
```ts
|
|
370
|
+
getPositionById(id): Node;
|
|
371
|
+
```
|
|
372
|
+
|
|
373
|
+
Returns the node position that is currently stored in the visualisation for a given id.
|
|
374
|
+
|
|
375
|
+
#### Parameters
|
|
376
|
+
|
|
377
|
+
| Parameter | Type | Description |
|
|
378
|
+
| ------ | ------ | ------ |
|
|
379
|
+
| `id` | `string` | The id of the node position that should be returned. |
|
|
380
|
+
|
|
381
|
+
#### Returns
|
|
382
|
+
|
|
383
|
+
[`Node`](../interfaces/Node.md)
|
|
384
|
+
|
|
385
|
+
The position information for the given id, or undefined if there is no such [node](../interfaces/Node.md).
|
|
386
|
+
or the layout has not yet run with that node.
|
|
387
|
+
|
|
388
|
+
***
|
|
389
|
+
|
|
390
|
+
### getRelationshipById()
|
|
391
|
+
|
|
392
|
+
```ts
|
|
393
|
+
getRelationshipById(id): Relationship;
|
|
394
|
+
```
|
|
395
|
+
|
|
396
|
+
Returns the relationship data that is currently stored in the visualisation for a given id.
|
|
397
|
+
|
|
398
|
+
#### Parameters
|
|
399
|
+
|
|
400
|
+
| Parameter | Type | Description |
|
|
401
|
+
| ------ | ------ | ------ |
|
|
402
|
+
| `id` | `string` | The id of the [relationship](../interfaces/Relationship.md) that should be returned. |
|
|
403
|
+
|
|
404
|
+
#### Returns
|
|
405
|
+
|
|
406
|
+
[`Relationship`](../interfaces/Relationship.md)
|
|
407
|
+
|
|
408
|
+
The [relationship](../interfaces/Relationship.md) or undefined if there is no relationship with the given id.
|
|
409
|
+
|
|
410
|
+
***
|
|
411
|
+
|
|
412
|
+
### getRelationships()
|
|
413
|
+
|
|
414
|
+
```ts
|
|
415
|
+
getRelationships(): Relationship[];
|
|
416
|
+
```
|
|
417
|
+
|
|
418
|
+
Returns the relationships that are currently in the visualization.
|
|
419
|
+
|
|
420
|
+
#### Returns
|
|
421
|
+
|
|
422
|
+
[`Relationship`](../interfaces/Relationship.md)[]
|
|
423
|
+
|
|
424
|
+
An array of the [relationships](../interfaces/Relationship.md) in the visualization.
|
|
425
|
+
|
|
426
|
+
***
|
|
427
|
+
|
|
428
|
+
### getScale()
|
|
429
|
+
|
|
430
|
+
```ts
|
|
431
|
+
getScale(): number;
|
|
432
|
+
```
|
|
433
|
+
|
|
434
|
+
Get the current zoom level of the viewport.
|
|
435
|
+
|
|
436
|
+
#### Returns
|
|
437
|
+
|
|
438
|
+
`number`
|
|
439
|
+
|
|
440
|
+
The current zoom level.
|
|
441
|
+
|
|
442
|
+
***
|
|
443
|
+
|
|
444
|
+
### getSelectedNodes()
|
|
445
|
+
|
|
446
|
+
```ts
|
|
447
|
+
getSelectedNodes(): Node & Point[];
|
|
448
|
+
```
|
|
449
|
+
|
|
450
|
+
Gets the currently selected nodes.
|
|
451
|
+
|
|
452
|
+
#### Returns
|
|
453
|
+
|
|
454
|
+
[`Node`](../interfaces/Node.md) & [`Point`](../interfaces/Point.md)[]
|
|
455
|
+
|
|
456
|
+
An array of all currently selected [nodes](../interfaces/Node.md) and their positions.
|
|
457
|
+
|
|
458
|
+
***
|
|
459
|
+
|
|
460
|
+
### getSelectedRelationships()
|
|
461
|
+
|
|
462
|
+
```ts
|
|
463
|
+
getSelectedRelationships(): Relationship[];
|
|
464
|
+
```
|
|
465
|
+
|
|
466
|
+
Gets the currently selected relationships.
|
|
467
|
+
|
|
468
|
+
#### Returns
|
|
469
|
+
|
|
470
|
+
[`Relationship`](../interfaces/Relationship.md)[]
|
|
471
|
+
|
|
472
|
+
An array of all currently selected [relationships](../interfaces/Relationship.md).
|
|
473
|
+
|
|
474
|
+
***
|
|
475
|
+
|
|
476
|
+
### getSvgDataUrl()
|
|
477
|
+
|
|
478
|
+
```ts
|
|
479
|
+
getSvgDataUrl(options?): Promise<string>;
|
|
480
|
+
```
|
|
481
|
+
|
|
482
|
+
**`Experimental`**
|
|
483
|
+
|
|
484
|
+
Returns the entire graph visualization as an SVG data URL.
|
|
485
|
+
|
|
486
|
+
#### Parameters
|
|
487
|
+
|
|
488
|
+
| Parameter | Type | Description |
|
|
489
|
+
| ------ | ------ | ------ |
|
|
490
|
+
| `options` | \{ `backgroundColor?`: `string`; \} | Options for the SVG export |
|
|
491
|
+
| `options.backgroundColor?` | `string` | The background color of the SVG (defaults to transparent). |
|
|
492
|
+
|
|
493
|
+
#### Returns
|
|
494
|
+
|
|
495
|
+
`Promise`\<`string`\>
|
|
496
|
+
|
|
497
|
+
A Promise resolving to a data URL string representing the graph as SVG (data:image/svg+xml;...)
|
|
498
|
+
|
|
499
|
+
#### Example
|
|
500
|
+
|
|
501
|
+
```typescript
|
|
502
|
+
import { NVL } from '@neo4j-nvl/base'
|
|
503
|
+
|
|
504
|
+
const nvl = new NVL(document.getElementById('frame'), [{ id: '0' }], [])
|
|
505
|
+
const renderSvg = async () => {
|
|
506
|
+
const svgDataUrl = await nvl.getSvgDataUrl({ backgroundColor: '#ffffff' })
|
|
507
|
+
const img = document.createElement('img')
|
|
508
|
+
img.src = svgDataUrl
|
|
509
|
+
document.body.appendChild(img)
|
|
510
|
+
}
|
|
511
|
+
```
|
|
512
|
+
|
|
513
|
+
***
|
|
514
|
+
|
|
515
|
+
### getZoomLimits()
|
|
516
|
+
|
|
517
|
+
```ts
|
|
518
|
+
getZoomLimits(): {
|
|
519
|
+
maxZoom: number;
|
|
520
|
+
minZoom: number;
|
|
521
|
+
};
|
|
522
|
+
```
|
|
523
|
+
|
|
524
|
+
#### Returns
|
|
525
|
+
|
|
526
|
+
```ts
|
|
527
|
+
{
|
|
528
|
+
maxZoom: number;
|
|
529
|
+
minZoom: number;
|
|
530
|
+
}
|
|
531
|
+
```
|
|
532
|
+
|
|
533
|
+
| Name | Type |
|
|
534
|
+
| ------ | ------ |
|
|
535
|
+
| `maxZoom` | `number` |
|
|
536
|
+
| `minZoom` | `number` |
|
|
537
|
+
|
|
538
|
+
***
|
|
539
|
+
|
|
540
|
+
### isLayoutMoving()
|
|
541
|
+
|
|
542
|
+
```ts
|
|
543
|
+
isLayoutMoving(): boolean;
|
|
544
|
+
```
|
|
545
|
+
|
|
546
|
+
Checks and returns whether the current layout is still in flux.
|
|
547
|
+
|
|
548
|
+
#### Returns
|
|
549
|
+
|
|
550
|
+
`boolean`
|
|
551
|
+
|
|
552
|
+
Whether or not the layout is moving.
|
|
553
|
+
|
|
554
|
+
***
|
|
555
|
+
|
|
556
|
+
### pinNode()
|
|
557
|
+
|
|
558
|
+
```ts
|
|
559
|
+
pinNode(nodeId): void;
|
|
560
|
+
```
|
|
561
|
+
|
|
562
|
+
Pins the specified node so it is not affected by layout forces.
|
|
563
|
+
|
|
564
|
+
#### Parameters
|
|
565
|
+
|
|
566
|
+
| Parameter | Type | Description |
|
|
567
|
+
| ------ | ------ | ------ |
|
|
568
|
+
| `nodeId` | `string` | The id of the node to be pinned. |
|
|
569
|
+
|
|
570
|
+
#### Returns
|
|
571
|
+
|
|
572
|
+
`void`
|
|
573
|
+
|
|
574
|
+
***
|
|
575
|
+
|
|
576
|
+
### removeNodesWithIds()
|
|
577
|
+
|
|
578
|
+
```ts
|
|
579
|
+
removeNodesWithIds(nodeIds): void;
|
|
580
|
+
```
|
|
581
|
+
|
|
582
|
+
Removes the specified nodes from the current scene.
|
|
583
|
+
|
|
584
|
+
#### Parameters
|
|
585
|
+
|
|
586
|
+
| Parameter | Type | Description |
|
|
587
|
+
| ------ | ------ | ------ |
|
|
588
|
+
| `nodeIds` | `string`[] | The node ids to be removed. Adjacent relationships will also be removed. |
|
|
589
|
+
|
|
590
|
+
#### Returns
|
|
591
|
+
|
|
592
|
+
`void`
|
|
593
|
+
|
|
594
|
+
***
|
|
595
|
+
|
|
596
|
+
### removeRelationshipsWithIds()
|
|
597
|
+
|
|
598
|
+
```ts
|
|
599
|
+
removeRelationshipsWithIds(relationshipIds): void;
|
|
600
|
+
```
|
|
601
|
+
|
|
602
|
+
Removes the specified relationships from the current scene.
|
|
603
|
+
|
|
604
|
+
#### Parameters
|
|
605
|
+
|
|
606
|
+
| Parameter | Type | Description |
|
|
607
|
+
| ------ | ------ | ------ |
|
|
608
|
+
| `relationshipIds` | `string`[] | The relationship ids to be removed. |
|
|
609
|
+
|
|
610
|
+
#### Returns
|
|
611
|
+
|
|
612
|
+
`void`
|
|
613
|
+
|
|
614
|
+
***
|
|
615
|
+
|
|
616
|
+
### resetZoom()
|
|
617
|
+
|
|
618
|
+
```ts
|
|
619
|
+
resetZoom(): void;
|
|
620
|
+
```
|
|
621
|
+
|
|
622
|
+
Resets the zoom of the viewport back to the default zoom level of 0.75.
|
|
623
|
+
|
|
624
|
+
#### Returns
|
|
625
|
+
|
|
626
|
+
`void`
|
|
627
|
+
|
|
628
|
+
***
|
|
629
|
+
|
|
630
|
+
### restart()
|
|
631
|
+
|
|
632
|
+
```ts
|
|
633
|
+
restart(options?, retainPositions?): void;
|
|
634
|
+
```
|
|
635
|
+
|
|
636
|
+
Restarts the NVL instance.
|
|
637
|
+
|
|
638
|
+
#### Parameters
|
|
639
|
+
|
|
640
|
+
| Parameter | Type | Default value | Description |
|
|
641
|
+
| ------ | ------ | ------ | ------ |
|
|
642
|
+
| `options` | [`NvlOptions`](../interfaces/NvlOptions.md) | `{}` | New [NvlOptions](../interfaces/NvlOptions.md) for the NVL instance. |
|
|
643
|
+
| `retainPositions` | `boolean` | `false` | Whether or not to retain the current node positions. New options will be merged with current options |
|
|
644
|
+
|
|
645
|
+
#### Returns
|
|
646
|
+
|
|
647
|
+
`void`
|
|
648
|
+
|
|
649
|
+
***
|
|
650
|
+
|
|
651
|
+
### saveFullGraphToLargeFile()
|
|
652
|
+
|
|
653
|
+
```ts
|
|
654
|
+
saveFullGraphToLargeFile(options?): void;
|
|
655
|
+
```
|
|
656
|
+
|
|
657
|
+
Saves the entire graph visualization canvas as a png to the client.
|
|
658
|
+
|
|
659
|
+
#### Parameters
|
|
660
|
+
|
|
661
|
+
| Parameter | Type | Description |
|
|
662
|
+
| ------ | ------ | ------ |
|
|
663
|
+
| `options` | \{ `backgroundColor?`: `string`; `filename?`: `string`; \} | The filename and background color of the png. |
|
|
664
|
+
| `options.backgroundColor?` | `string` | The background color of the png file. The size of the png file will be as large as the entire graph at the default zoom level. Can result in a very large file. |
|
|
665
|
+
| `options.filename?` | `string` | The filename of the png file. |
|
|
666
|
+
|
|
667
|
+
#### Returns
|
|
668
|
+
|
|
669
|
+
`void`
|
|
670
|
+
|
|
671
|
+
***
|
|
672
|
+
|
|
673
|
+
### saveToFile()
|
|
674
|
+
|
|
675
|
+
```ts
|
|
676
|
+
saveToFile(options?): void;
|
|
677
|
+
```
|
|
678
|
+
|
|
679
|
+
Saves the current view of the graph visualization canvas as a png to the client.
|
|
680
|
+
|
|
681
|
+
#### Parameters
|
|
682
|
+
|
|
683
|
+
| Parameter | Type | Description |
|
|
684
|
+
| ------ | ------ | ------ |
|
|
685
|
+
| `options` | \{ `backgroundColor?`: `string`; `filename?`: `string`; \} | The filename and background color of the png. |
|
|
686
|
+
| `options.backgroundColor?` | `string` | The background color of the png file. The size of the png file will be the size of the canvas in the DOM. |
|
|
687
|
+
| `options.filename?` | `string` | The filename of the png file. |
|
|
688
|
+
|
|
689
|
+
#### Returns
|
|
690
|
+
|
|
691
|
+
`void`
|
|
692
|
+
|
|
693
|
+
***
|
|
694
|
+
|
|
695
|
+
### saveToSvg()
|
|
696
|
+
|
|
697
|
+
```ts
|
|
698
|
+
saveToSvg(options?): void;
|
|
699
|
+
```
|
|
700
|
+
|
|
701
|
+
**`Experimental`**
|
|
702
|
+
|
|
703
|
+
Saves the entire graph visualization as an SVG file to the client.
|
|
704
|
+
|
|
705
|
+
#### Parameters
|
|
706
|
+
|
|
707
|
+
| Parameter | Type | Description |
|
|
708
|
+
| ------ | ------ | ------ |
|
|
709
|
+
| `options` | \{ `backgroundColor?`: `string`; `filename?`: `string`; \} | Options for the SVG export |
|
|
710
|
+
| `options.backgroundColor?` | `string` | The background color of the SVG file. |
|
|
711
|
+
| `options.filename?` | `string` | The filename of the SVG file. |
|
|
712
|
+
|
|
713
|
+
#### Returns
|
|
714
|
+
|
|
715
|
+
`void`
|
|
716
|
+
|
|
717
|
+
***
|
|
718
|
+
|
|
719
|
+
### setDisableWebGL()
|
|
720
|
+
|
|
721
|
+
```ts
|
|
722
|
+
setDisableWebGL(disabled?): void;
|
|
723
|
+
```
|
|
724
|
+
|
|
725
|
+
**`Experimental`**
|
|
726
|
+
|
|
727
|
+
Restarts NVL with or without WebGL support.
|
|
728
|
+
|
|
729
|
+
#### Parameters
|
|
730
|
+
|
|
731
|
+
| Parameter | Type | Default value | Description |
|
|
732
|
+
| ------ | ------ | ------ | ------ |
|
|
733
|
+
| `disabled` | `boolean` | `false` | Whether or not WebGL should be disabled. |
|
|
734
|
+
|
|
735
|
+
#### Returns
|
|
736
|
+
|
|
737
|
+
`void`
|
|
738
|
+
|
|
739
|
+
***
|
|
740
|
+
|
|
741
|
+
### setLayout()
|
|
742
|
+
|
|
743
|
+
```ts
|
|
744
|
+
setLayout(layout): void;
|
|
745
|
+
```
|
|
746
|
+
|
|
747
|
+
Changes the layout type.
|
|
748
|
+
|
|
749
|
+
#### Parameters
|
|
750
|
+
|
|
751
|
+
| Parameter | Type | Description |
|
|
752
|
+
| ------ | ------ | ------ |
|
|
753
|
+
| `layout` | [`Layout`](../type-aliases/Layout.md) | The [Layout](../type-aliases/Layout.md) type. |
|
|
754
|
+
|
|
755
|
+
#### Returns
|
|
756
|
+
|
|
757
|
+
`void`
|
|
758
|
+
|
|
759
|
+
***
|
|
760
|
+
|
|
761
|
+
### setLayoutOptions()
|
|
762
|
+
|
|
763
|
+
```ts
|
|
764
|
+
setLayoutOptions(options): void;
|
|
765
|
+
```
|
|
766
|
+
|
|
767
|
+
Updates the configuration of the current layout.
|
|
768
|
+
|
|
769
|
+
#### Parameters
|
|
770
|
+
|
|
771
|
+
| Parameter | Type | Description |
|
|
772
|
+
| ------ | ------ | ------ |
|
|
773
|
+
| `options` | [`LayoutOptions`](../type-aliases/LayoutOptions.md) | The [LayoutOptions](../type-aliases/LayoutOptions.md) configuration. |
|
|
774
|
+
|
|
775
|
+
#### Returns
|
|
776
|
+
|
|
777
|
+
`void`
|
|
778
|
+
|
|
779
|
+
***
|
|
780
|
+
|
|
781
|
+
### setNodePositions()
|
|
782
|
+
|
|
783
|
+
```ts
|
|
784
|
+
setNodePositions(data, updateLayout?): void;
|
|
785
|
+
```
|
|
786
|
+
|
|
787
|
+
Sets the node positions based on data provided.
|
|
788
|
+
|
|
789
|
+
#### Parameters
|
|
790
|
+
|
|
791
|
+
| Parameter | Type | Default value | Description |
|
|
792
|
+
| ------ | ------ | ------ | ------ |
|
|
793
|
+
| `data` | [`Node`](../interfaces/Node.md)[] | `undefined` | The positions that the nodes should be set to. |
|
|
794
|
+
| `updateLayout` | `boolean` | `false` | Whether or not the current layout algorithm should update the graph after setting the node positions. |
|
|
795
|
+
|
|
796
|
+
#### Returns
|
|
797
|
+
|
|
798
|
+
`void`
|
|
799
|
+
|
|
800
|
+
#### Remarks
|
|
801
|
+
|
|
802
|
+
For node positions to be unaffected by layout algorithms, use the 'free' layout type
|
|
803
|
+
or use [pinNode](#pinnode) to pin the nodes that should remain still.
|
|
804
|
+
False by default.
|
|
805
|
+
|
|
806
|
+
***
|
|
807
|
+
|
|
808
|
+
### setPan()
|
|
809
|
+
|
|
810
|
+
```ts
|
|
811
|
+
setPan(panX, panY): void;
|
|
812
|
+
```
|
|
813
|
+
|
|
814
|
+
Sets the zoom of the viewport to a specific value.
|
|
815
|
+
|
|
816
|
+
#### Parameters
|
|
817
|
+
|
|
818
|
+
| Parameter | Type | Description |
|
|
819
|
+
| ------ | ------ | ------ |
|
|
820
|
+
| `panX` | `number` | The desired panX value. |
|
|
821
|
+
| `panY` | `number` | The desired panY value. |
|
|
822
|
+
|
|
823
|
+
#### Returns
|
|
824
|
+
|
|
825
|
+
`void`
|
|
826
|
+
|
|
827
|
+
#### Remarks
|
|
828
|
+
|
|
829
|
+
When updating both the zoom level and pan coordinates,
|
|
830
|
+
use [setZoomAndPan](#setzoomandpan) instead of calling [setZoom](#setzoom) and [setPan](#setpan) separately to avoid jittering.
|
|
831
|
+
|
|
832
|
+
***
|
|
833
|
+
|
|
834
|
+
### setRenderer()
|
|
835
|
+
|
|
836
|
+
```ts
|
|
837
|
+
setRenderer(renderer): void;
|
|
838
|
+
```
|
|
839
|
+
|
|
840
|
+
Switches between rendering methods
|
|
841
|
+
|
|
842
|
+
#### Parameters
|
|
843
|
+
|
|
844
|
+
| Parameter | Type | Description |
|
|
845
|
+
| ------ | ------ | ------ |
|
|
846
|
+
| `renderer` | `string` | which rendering method to use |
|
|
847
|
+
|
|
848
|
+
#### Returns
|
|
849
|
+
|
|
850
|
+
`void`
|
|
851
|
+
|
|
852
|
+
***
|
|
853
|
+
|
|
854
|
+
### setZoom()
|
|
855
|
+
|
|
856
|
+
```ts
|
|
857
|
+
setZoom(zoomValue): void;
|
|
858
|
+
```
|
|
859
|
+
|
|
860
|
+
Sets the zoom of the viewport to a specific value.
|
|
861
|
+
|
|
862
|
+
#### Parameters
|
|
863
|
+
|
|
864
|
+
| Parameter | Type | Description |
|
|
865
|
+
| ------ | ------ | ------ |
|
|
866
|
+
| `zoomValue` | `number` | The desired zoom level. |
|
|
867
|
+
|
|
868
|
+
#### Returns
|
|
869
|
+
|
|
870
|
+
`void`
|
|
871
|
+
|
|
872
|
+
#### Remarks
|
|
873
|
+
|
|
874
|
+
When updating both the zoom level and pan coordinates,
|
|
875
|
+
use [setZoomAndPan](#setzoomandpan) instead of calling [setZoom](#setzoom) and [setPan](#setpan)
|
|
876
|
+
separately to avoid jittering.
|
|
877
|
+
|
|
878
|
+
If the zoom level is outside of the range provided by the
|
|
879
|
+
[NvlOptions.minZoom](../interfaces/NvlOptions.md#minzoom) and [NvlOptions.maxZoom](../interfaces/NvlOptions.md#maxzoom) options,
|
|
880
|
+
the zoom level will be set to the closest valid zoom level.
|
|
881
|
+
If [NvlOptions.allowDynamicMinZoom](../interfaces/NvlOptions.md#allowdynamicminzoom) is set to true,
|
|
882
|
+
the [NvlOptions.minZoom](../interfaces/NvlOptions.md#minzoom) option will be ignored of the current graph does not fit the viewport.
|
|
883
|
+
|
|
884
|
+
***
|
|
885
|
+
|
|
886
|
+
### setZoomAndPan()
|
|
887
|
+
|
|
888
|
+
```ts
|
|
889
|
+
setZoomAndPan(
|
|
890
|
+
zoom,
|
|
891
|
+
panX,
|
|
892
|
+
panY
|
|
893
|
+
): void;
|
|
894
|
+
```
|
|
895
|
+
|
|
896
|
+
Sets the zoom and pan of the viewport to specific values.
|
|
897
|
+
|
|
898
|
+
#### Parameters
|
|
899
|
+
|
|
900
|
+
| Parameter | Type | Description |
|
|
901
|
+
| ------ | ------ | ------ |
|
|
902
|
+
| `zoom` | `number` | The desired zoom level. |
|
|
903
|
+
| `panX` | `number` | The desired panX value. |
|
|
904
|
+
| `panY` | `number` | The desired panY value. |
|
|
905
|
+
|
|
906
|
+
#### Returns
|
|
907
|
+
|
|
908
|
+
`void`
|
|
909
|
+
|
|
910
|
+
#### Remarks
|
|
911
|
+
|
|
912
|
+
When only updating zoom level or pan coordinates, use [setZoom](#setzoom) or [setPan](#setpan) instead.
|
|
913
|
+
|
|
914
|
+
If the zoom level is outside of the range provided by the
|
|
915
|
+
[NvlOptions.minZoom](../interfaces/NvlOptions.md#minzoom) and [NvlOptions.maxZoom](../interfaces/NvlOptions.md#maxzoom) options,
|
|
916
|
+
the zoom level will be set to the closest valid zoom level.
|
|
917
|
+
If [NvlOptions.allowDynamicMinZoom](../interfaces/NvlOptions.md#allowdynamicminzoom) is set to true,
|
|
918
|
+
the [NvlOptions.minZoom](../interfaces/NvlOptions.md#minzoom) option will be ignored of the current graph does not fit the viewport.
|
|
919
|
+
|
|
920
|
+
***
|
|
921
|
+
|
|
922
|
+
### unPinNode()
|
|
923
|
+
|
|
924
|
+
```ts
|
|
925
|
+
unPinNode(nodeIds): void;
|
|
926
|
+
```
|
|
927
|
+
|
|
928
|
+
Un-pins the specified nodes so it is affected by layout forces again.
|
|
929
|
+
|
|
930
|
+
#### Parameters
|
|
931
|
+
|
|
932
|
+
| Parameter | Type | Description |
|
|
933
|
+
| ------ | ------ | ------ |
|
|
934
|
+
| `nodeIds` | `string`[] | The ids of the nodes to be un-pinned. |
|
|
935
|
+
|
|
936
|
+
#### Returns
|
|
937
|
+
|
|
938
|
+
`void`
|
|
939
|
+
|
|
940
|
+
***
|
|
941
|
+
|
|
942
|
+
### updateElementsInGraph()
|
|
943
|
+
|
|
944
|
+
```ts
|
|
945
|
+
updateElementsInGraph(nodes, relationships): void;
|
|
946
|
+
```
|
|
947
|
+
|
|
948
|
+
Updates relationships in the current scene with the provided array of nodes and relationships.
|
|
949
|
+
|
|
950
|
+
#### Parameters
|
|
951
|
+
|
|
952
|
+
| Parameter | Type | Description |
|
|
953
|
+
| ------ | ------ | ------ |
|
|
954
|
+
| `nodes` | \| [`Node`](../interfaces/Node.md)[] \| [`PartialNode`](../type-aliases/PartialNode.md)[] | The updated [nodes](../interfaces/Node.md). |
|
|
955
|
+
| `relationships` | \| [`Relationship`](../interfaces/Relationship.md)[] \| [`PartialRelationship`](../type-aliases/PartialRelationship.md)[] | The updated [relationships](../interfaces/Relationship.md). Ignores any nodes or relationships that do not exist in the current scene. To update nodes or relationships, they must have an id that matches the id of the node or relationship to be updated. Only the properties that are provided will be updated. If an existing property is not provided, it will not be changed. |
|
|
956
|
+
|
|
957
|
+
#### Returns
|
|
958
|
+
|
|
959
|
+
`void`
|
|
960
|
+
|
|
961
|
+
#### Example
|
|
962
|
+
|
|
963
|
+
Updating nodes and relationships
|
|
964
|
+
```ts
|
|
965
|
+
import { NVL } from '@neo4j-nvl/base'
|
|
966
|
+
|
|
967
|
+
const nodes = [
|
|
968
|
+
{ id: '1', label: 'Node 1', color: '#e04141' },
|
|
969
|
+
{ id: '2', label: 'Node 2', color: '#e09c41' }
|
|
970
|
+
]
|
|
971
|
+
const relationships = [
|
|
972
|
+
{ id: '12', from: '1', to: '2' }
|
|
973
|
+
]
|
|
974
|
+
const nvl = new NVL(document.getElementById('frame'), nodes, relationships)
|
|
975
|
+
// Updates an existing node and relationship
|
|
976
|
+
nvl.updateElementsInGraph([{ id: '1', selected: true }], [{ id: '12', color: '#e0df41' }])
|
|
977
|
+
```
|