diff --git a/example/SimpleGraph.js b/example/SimpleGraph.js index a972d9e2..7b4e030b 100644 --- a/example/SimpleGraph.js +++ b/example/SimpleGraph.js @@ -1,6 +1,6 @@ import React, { PureComponent } from 'react'; -import Graph, { isEdge, removeElements } from '../src'; +import Graph, { isEdge, removeElements, getOutgoers } from '../src'; // import Graph from '../dist/ReactGraph'; const SpecialNode = ({ data, onChange, styles }) => ( @@ -57,7 +57,7 @@ class App extends PureComponent { } onLoad(graphInstance) { - console.log('graph loaded:', this.graphInstance); + console.log('graph loaded:', graphInstance); window.rg = graphInstance; this.graphInstance = graphInstance; @@ -89,6 +89,11 @@ class App extends PureComponent { })); } + onElementClick(element) { + console.log('click', element); + console.log('outgoers', getOutgoers(element, this.state.elements)); + } + onZoomIn() { this.graphInstance.zoomIn(); } @@ -107,7 +112,7 @@ class App extends PureComponent { return ( console.log('clicked', node)} + onElementClick={element => this.onElementClick(element)} onElementsRemove={elements => this.onElementsRemove(elements)} style={{ width: '100%', height: '100%' }} onLoad={graphInstance => this.onLoad(graphInstance)} diff --git a/src/graph-utils.js b/src/graph-utils.js index 36bdc1b9..e9b672ed 100644 --- a/src/graph-utils.js +++ b/src/graph-utils.js @@ -2,6 +2,15 @@ export const isEdge = element => element.source && element.target; export const isNode = element => !element.source && !element.target; +export const getOutgoers = (node, elements) => { + if (!isNode(node)) { + return []; + } + + const outgoerIds = elements.filter(e => e.source === node.id).map(e => e.target); + return elements.filter(e => outgoerIds.includes(e.id)); +}; + export const removeElements = (elements, elementsToRemove) => { const nodeIdsToRemove = elementsToRemove.filter(isNode).map(n => n.id); @@ -12,7 +21,7 @@ export const removeElements = (elements, elementsToRemove) => { !nodeIdsToRemove.includes(e.source) ); }); -} +}; export const parseElements = e => { e.type = e.type || 'default'; diff --git a/src/index.js b/src/index.js index 2dc138ee..04d94cee 100644 --- a/src/index.js +++ b/src/index.js @@ -2,11 +2,13 @@ import ReactGraph from './ReactGraph'; import { isNode as _isNode , isEdge as _isEdge, - removeElements as _removeElements + removeElements as _removeElements, + getOutgoers as _getOutgoers } from './graph-utils'; export const isNode = _isNode; export const isEdge = _isEdge; export const removeElements = _removeElements; +export const getOutgoers = _getOutgoers; export default ReactGraph; \ No newline at end of file