'Calling react-d3-graph function outside of graph
I have created a network topography map using react-3d-graph and I am trying to access functions which are native to react-3d-graph outside of the graph itself. For example, I have a button which needs to utilize highlight behavior to highlight an individual node and its related nodes/links. Is there a way to do this? Here is the code for the graph:
const myConfig = {
"automaticRearrangeAfterDropNode": false,
"collapsible": true,
"height": 700,
"highlightDegree": 1,
"highlightOpacity": 0.2,
"linkHighlightBehavior": true,
"maxZoom": 8,
"minZoom": 0.1,
"nodeHighlightBehavior": true,
"panAndZoom": false,
"staticGraph": false,
"width": 1100,
"d3": {
"alphaTarget": 0.05,
"gravity": -200,
"linkLength": 300,
"linkStrength": 1
},
"node": {
"color": "#57a3ff",
"fontColor": "black",
"fontSize": 12,
"fontWeight": "bold",
"highlightColor": "red",
"highlightFontSize": 12,
"highlightFontWeight": "bold",
"highlightStrokeColor": "SAME",
"highlightStrokeWidth": 1.5,
"labelProperty": "name",
"mouseCursor": "pointer",
"opacity": 1,
"renderLabel": true,
"size": 450,
"strokeColor": "none",
"strokeWidth": 1.5,
"svg": "",
"symbolType": "square"
},
"link": {
"color": "#d3d3d3",
"opacity": 1,
"semanticStrokeWidth": false,
"strokeWidth": 4,
"highlightColor": "blue"
}
};
And here is the Graph component.
<Graph
id="graph-id"
data={data}
config={myConfig}
onClickNode={this.props.toggle}
onClickGraph={onClickGraph}
onClickLink={onClickLink}
/>
The function I am trying to access is "nodeHighlightBehavior". Is there a way to do this?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|