Question

我使用react-graph-vis来可视化网络。根据{{3}}，我可以通过向manipulation键提供适当的options对象来打开操作系统。我尝试在可视化GUI中添加Add Edge按钮，这或多或少是我配置组件的方式：

class MyComponent extends React.Component {
   constructor(props) {
      var graph = /* initial graph */;
      this.state = {
         options: {
            manipulation: {
               enabled: true, initiallyActive: true, addEdge: true
            }
         },
         graph: graph
      }
   }

   render() {
      return <Graph graph={this.state.graph}, options={this.state.options}/>
   }
}

组件呈现指定的graph，但GUI中缺少操作系统。也就是说，将manipulation条目添加到options根本没有任何效果。特别是，没有edit或add edge按钮，因此无法操纵图形。我没有得到任何错误，问题只是操纵系统没有被渲染。添加其他选项（例如与网络布局相关的选项）可以正常工作。只有manipulation选项似乎没有设置。

Answer 1

确保导入vis.js样式表。这样做的方式取决于项目的设置。

您可以将其包含在CDN的html文件中：

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.19.1/vis-network.min.css">

如果您使用的是webpack，可以在JavaScript文件中添加以下内容：

import 'vis/dist/vis.css';

在react-graph-vis中激活操作系统

1 个答案: