AntV - G6 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
AntV - G6 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
AntV - G6 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
AntV - G6 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
AntV - G6 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !

软件简介

G6 是一个图可视化引擎。它提供了图的绘制、布局、分析、交互、动画等图可视化的基础能力。旨在让关系变得透明,简单。让用户获得关系数据的 Insight。

基于 G6,用户可以快速搭建自己的 图分析 或 图编辑 应用。

如果你还没有使用过 G6, 建议通过快速上手先体验一下 G6 的魅力。

G6 的特性

G6 作为一款专业的图可视化引擎,具有以下特性:

  • 丰富的元素:内置丰富的节点与边元素,自由配置,支持自定义;
  • 可控的交互:内置 10+ 交互行为,支持自定义交互;
  • 强大的布局:内置了 10+ 常用的图布局,支持自定义布局;
  • 便捷的组件:优化内置组件功能及性能;
  • 友好的体验:根据用户需求分层梳理文档,支持 TypeScript 类型推断。

除了默认好用、配置自由的内置功能,元素、交互、布局均具有高可扩展的自定义机制。

丰富的图元素

强大的布局及动画

G6 文档

快速上手

// 定义数据源
const data = {
  // 点集
  nodes: [
    {
      id: 'node1',
      x: 100,
      y: 200,
    },
    {
      id: 'node2',
      x: 300,
      y: 200,
    },
  ],
  // 边集
  edges: [
    // 表示一条从 node1 节点连接到 node2 节点的边
    {
      source: 'node1',
      target: 'node2',
    },
  ],
};

// 创建 G6 图实例
const graph = new G6.Graph({
  container: 'mountNode', // 指定图画布的容器 id
  // 画布宽高
  width: 800,
  height: 500,
});
// 读取数据
graph.data(data);
// 渲染图
graph.render();

更详细的内容请参考快速上手文档。

友情链接

结合前端库的第三方实现:

展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论 (3)

加载中
AntV软件作者
欢迎使用开源图可视化与分析引擎:AntV G6. 欢迎点亮 Github star: https://github.com/antvis/G6 G6 官网:https://g6.antv.vision/zh
2019/11/28 21:11
回复
举报
dataV还活着吗?
2018/09/04 15:44
回复
举报
有预览链接吗
2017/11/22 21:17
回复
举报
更多评论
发表于大前端专区
2020/05/22 10:08

G6 v3.5 发布:全新节点分组与图算法

AntV G6 是一款开源的图可视化引擎,专注于图可视化及图分析领域。 > 欢迎关注和 star 我们的 GitHub:https://github.com/antvis/G6 > 官网:https://g6.antv.vision/zh/ 没有什么能够阻挡 G6 的迭代和发布。时隔 2 个月,G6 3.5 带来了两大新特性:节点分组 Combo 及图算法。 全新设计的节点分组 Combo > 通常认为,几个节点可以产生洞察,那么成千上万的节点则可以产生更多的洞察。但实际情况下,节点往往数量庞大,边错综复...

4
27
发表于大前端专区
2020/03/10 15:05

G6 3.4 又双叒叕来啦 ​​​​​​​

AntV G6 是一款开源的图可视化引擎,专注于图可视化及图分析。 欢迎关注和 Star 我们的 GitHub:https://github.com/antvis/G6 官网:https://g6.antv.vision/zh/ 上个月,性能强悍的 TS 版 G6 3.3 刚刚与大家见面。为解决长期以来的用户痛点,我们冒着秃头的风险,光速迭代开发。仅时隔一个月,G6 3.4 又来啦。别怕,我发誓,完全兼容 v3.3!没有最好,只有更好! SVG is Coming back! 为强化性能, G6 3.3 进行了底层渲染引擎...

3
25
发表于大前端专区
2019/11/28 15:54

G6 3.2.0 发布,AntV 的图可视化与图分析

G6 是 AntV 旗下的一款专业级图可视化引擎,它在高定制能力的基础上,提供简单、易用的接口以及一系列设计优雅的图可视化解决方案,是阿里经济体图可视化与图分析的基础设施。今年 AntV 11.22 品牌日,我们带来了新的 G6 3.2.0 版本。该版本着重改进了开发体验,增加了许多新元素和组件,并提供了更为高级的布局算法。 与此同时,我们发布一款基于 G6 引擎封装的、开箱即用的图可视化工具——Graphin,你只要对它进行简单配置,...

0
27
发表于大前端专区
2018/09/04 11:31

蚂蚁金服 AntV 发布 G6 2.1 -- 一路同行

G6 是一个简单、易用、完备的图可视化引擎。它在高定制能力的基础上,提供了一系列设计优雅、便于使用的图可视化解决方案,帮助开发者高效搭建属于自己的 图分析 或 图编辑器 应用。 项目 GitHub 地址:https://github.com/antvis/g6 项目文档地址:https://www.yuque.com/antv/g6 过往 图为 2018.06.06 ~ 2018.09.04 使用 G6 活跃系统增长的过程 光阴荏苒,转瞬间,夏去秋来。自 2018.06.06 开源至今的短短三个月,G6 的使用量...

1
17
发表于大前端专区
2018/06/06 10:40

裂变·聚变:蚂蚁金服 AntV 数据可视化引擎 G6 2.0 发布

G6 是 蚂蚁金服-AntV 旗下的针对关系数据的可视化引擎。从 2016 年 12 月,G6 立项至今,已经过去了 1 年半的时间。在过去的时光里,G6 直接或间接的支持了阿里经济体近一百个业务系统。期间获得过赞誉,也有吐槽,取得一定成就,也暴露过不少问题。半年前,我们结合真实业务需求和业内成熟框架的特点,以及自己内心的丁点不安分创新,开启了 G6 2.0 的开发工作,经过精心设计,以及与诸多业务方数月共同打磨 —— 今天,我们怀...

15
58
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
发表了博客
2020/12/25 18:04

AntV 架构演进-G6 篇

此文转载自:https://my.oschina.net/u/4309229/blog/3164865 LiteOS Studio图形化调测能力,物联网打工人必备!>>> 本文作者:AntV 架构师-萧庆 简介 G6 是一个图关系可视化引擎,起始于我们的业务需求,历经波折,每次改版其架构都有很大的变化,这些变化背后都有来自业务上的思考和我们对 G6 定位的调整,今天我们一起来回顾: G6 之前的关系可视化 V1.0 关系映射 V2.0 图编辑器 V3.0 图分析引擎 G6 发展的时间线如下: G6 之...

0
0
发表于软件架构专区
2019/11/28 11:59

G6:AntV 的图可视化与图分析

![](https://pic1.zhimg.com/v2-de9f0f46f75755ef43373a1ee0e0e2cf_1200x500.jpg) ## 导读 G6 是 AntV 旗下的一款专业级图可视化引擎,它在高定制能力的基础上,提供简单、易用的接口以及一系列设计优雅的图可视化解决方案,是阿里经济体图可视化与图分析的基础设施。今年 AntV 11.22 品牌日,我们带来了新的 **G6 3.2.0 版本**。该版本着重改进了开发体验,增加了许多新元素和组件,并提供了更为高级的布局算法。 与此同时,我...

7
8
发表了博客
2019/12/01 18:30

G6:AntV 的图可视化与图分析

  导读      G6 是 AntV 旗下的一款专业级图可视化引擎,它在高定制能力的基础上,提供简单、易用的接口以及一系列设计优雅的图可视化解决方案,是阿里经济体图可视化与图分析的基础设施。今年 AntV 11.22 品牌日,我们带来了新的 G6 3.2.0 版本。该版本着重改进了开发体验,增加了许多新元素和组件,并提供了更为高级的布局算法。      与此同时,我们发布一款基于 G6 引擎封装的、开箱即用的图可视化工具——Graph...

0
0
发表于大前端专区
2018/06/30 18:16

antv g6 图形库 出租车模拟

原文链接: antv g6 图形库 出租车模拟 上一篇: echartjs 绘制 圆环 排版 下一篇: mysql 安装 配置 https://antv.alipay.com/zh-cn/g6/1.x/index.html 效果 注意,删除节点时,会将连接的边一起删除。。。。。 修改边的话,先修改边在删除节点 g6 不支持(或没找到)可以使用svg或图片改变节点样式的方法。。。。 出租车 绿色表示等待 黄色表示去接人 蓝色表示将人送网目的地 人 橙色表示当前地点 黑色表示目的地点 people cla...

0
0
发表了博客
2018/12/18 16:23

antV G6流程图在Vue中的使用

<blockquote>最近我司项目中需要加入流程图制作功能,于是乎百度各种找可视化绘制拓扑图的轮子,大部分都是国外的,看文档太吃力,不过好在最终让我发现了AntV G6流程图图表库,最新版为2.0,不过编辑器在2.0版本还没有进行开源,所以只能退而求其次,使用了1.2.8版本。希望2.0版本的编辑器尽早开源,在交互方面1.2.8版本还是差了一些。<p>该组件并<strong><code>非开箱即食</code></strong>,需要根据自己的业务进行修改,右侧...

0
0
发表了博客
2020/03/19 20:23

「蚂蚁金服 AntV」G6 3.4 又双叒叕来啦

https://juejin.im/post/5e676e43518825495372113b AntV G6 是一款开源的图可视化引擎,专注于图可视化及图分析。 欢迎关注和 Star 我们的 GitHub:github.com/antvis/G6 官网:g6.antv.vision/zh/ 上个月,性能强悍的 TS 版 G6 3.3 刚刚与大家见面。为解决长期以来的用户痛点,我们冒着秃头的风险,光速迭代开发。仅时隔一个月,G6 3.4 又来啦。别怕,我发誓,完全兼容 v3.3!没有最好,只有更好! SVG is Coming back! 为强化...

0
0
发表于大前端专区
2020/03/10 14:26

蚂蚁金服 AntV G6 3.4 又双叒叕来啦

![发布稿 - G6.jpg](https://intranetproxy.alipay.com/skylark/lark/0/2020/jpeg/127608/1583817413625-16eaf1a4-9196-4db5-9171-32a4cc59a70c.jpeg#align=left&display=inline&height=287&name=%E5%8F%91%E5%B8%83%E7%A8%BF%20-%20G6.jpg&originHeight=476&originWidth=1020&size=58318&status=done&style=none&width=616) > AntV G6 是一款开源的图可视化引擎,专注于图可视化及图分析。 > 欢迎关注和 **Star** 我们的 GitH...

0
0
发表了博客
2020/03/19 20:02

「蚂蚁金服 AntV」G6 3.4 又双叒叕来啦

https://juejin.im/post/5e676e43518825495372113b AntV G6 是一款开源的图可视化引擎,专注于图可视化及图分析。 欢迎关注和 Star 我们的 GitHub:github.com/antvis/G6 官网:g6.antv.vision/zh/ 上个月,性能强悍的 TS 版 G6 3.3 刚刚与大家见面。为解决长期以来的用户痛点,我们冒着秃头的风险,光速迭代开发。仅时隔一个月,G6 3.4 又来啦。别怕,我发誓,完全兼容 v3.3!没有最好,只有更好! SVG is Coming back! 为强化...

0
0
发表于大前端专区
2018/01/19 11:44

antV G6中以html为节点的自动分层布局数据可视化详解

背景选型 现有系统中的业务流、组件流等展示是基于jsPlumb手动拖拽生成的。随着系统接入的公司越来越多,大量的CMDB关系数据自动展示迫在眉睫。经过一段时间的技术调研,最终选择蚂蚁金服的数据可视化规范antv 家族中的G6。 在引入项目之前,还是先从官网的示例开始,示例还挺多的、基本都是针对单个点进行讲解。在大概了解的怎么用后就引入本地develop环境。公司的项目前端是基于AngularJs构建的,把官网扫码业务流程这个示例引...

0
2
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
3 评论
231 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部