Skip to content
如何在React中使用G6,如何在使用G6的过程中渲染自定义的React组件,所有的疑问这里都可以帮你解答。
JavaScript CSS
Branch: master
Clone or download
zhanning.bzn
Latest commit c470026 Nov 14, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
pages 使用G6内置的布局 Nov 14, 2019
.DS_Store 添加是否渲染组件的标识值 Oct 5, 2019
.gitignore g6 in react demo Oct 5, 2019
README.md update readme file Oct 5, 2019
demo.gif 添加demo效果 Oct 5, 2019
package.json 使用G6内置的布局 Nov 14, 2019

README.md

如何在React中使用G6?

在平时的答疑工作中,经常会遇到「如何在React中使用G6」的问题,为了让G6用户能够在开发中很方便地接入G6,我们提供一个G6在React中使用的Demo,供开发者参考。

说明:鉴于目前React hooks比较🔥, 且大多数React开发者已经在使用hooks进行业务开发,因此,我们提供的Demo也是基于hooks的。

更详细的内容请参考React中使用G6文档。

功能

我们提供的Demo,包括了以下功能:

  • 自定义节点;
  • 自定义边;
  • 节点的tooltip;
  • 边的tooltip;
  • 节点的ContextMenu;
  • tooltip及ContextMenu如何渲染自定义的React组件。

Development

# clone repo
$ git clone https://github.com/baizn/g6-in-react.git

# install dependencies
$ npm install

# start server
$ npm start

You can’t perform that action at this time.