在图形外部调用react-d3-graph函数

Question

我已经使用react-3d-graph创建了一个网络拓扑图，我正在尝试在图本身之外访问对react-3d-graph固有的功能。例如，我有一个按钮，需要利用突出显示行为来突出显示单个节点及其相关的节点/链接。有没有办法做到这一点？这是图形的代码：

<div class="container">
    <div class="photobanner">
        <a href="#" class="first"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
    </div>
</div>
<div class="container">
    <div class="photobanner">
        <a href="#" class="second"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
    </div>
</div>
<div class="container">
    <div class="photobanner">
        <a href="#" class="first"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
        <a href="#"><img src="http://placehold.it/350x150"></a>
    </div>
</div>

这是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"
  }
};

我尝试访问的功能是“ nodeHighlightBehavior”。有办法吗？