G6: JavaScript 实现的图可视化引擎

English Document | GitHub

简介 - 图1

简介 - 图2

G6 是一个简单、易用、完备的图可视化引擎，它在高定制能力的基础上，提供了一系列设计优雅、便于使用的图可视化解决方案。能帮助开发者搭建属于自己的图 图分析 应用或是 图编辑器 应用。

简介 - 图3简介 - 图4简介 - 图5
简介 - 图6简介 - 图7

G6-Editor 图编辑器

简介 - 图8
简介 - 图9

安装

  1. $ npm install @antv/g6

使用

  1. import G6 from '@antv/g6';
  3. const data = {
  4.   nodes: [{
  5.     id: 'node1',
  6.     x: 100,
  7.     y: 200
  8.   },{
  9.     id: 'node2',
  10.     x: 300,
  11.     y: 200
  12.   }],
  13.   edges: [{
  14.     target: 'node2',
  15.     source: 'node1'
  16.   }]
  17. };
  18. const graph = new G6.Graph({
  19.   container: 'mountNode',
  20.   width: 500,
  21.   height: 500
  22. });
  23. graph.read(data);

开发

  1. $ npm install
  3. # run test case
  4. $ npm run test-live
  6. # build watching file changes and run demos
  7. $ npm run dev

如何贡献

请让我们知道您要解决或贡献什么，所以在贡献之前请先提交 issues 描述 bug 或建议。

成为一个贡献者前请阅读 代码贡献规范.

体验改进计划说明

为了更好服务用户，G6 会将 URL 和版本信息发送回 AntV 服务器：

  1. https://kcart.alipay.com/web/bi.do

除了 URL 与 G6 版本信息外，不会收集任何其他信息。如有担心，可以通过下面的代码关闭：

  1. // 关闭 G6 的体验改进计划打点请求
  2. G6.track(false)

我们决定从 11-26 日开始，停止体验改进计划，从 2.2.6 版本开始，默认关闭（考虑兼容性），在下个大版本 3.0.0 时移除掉。