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

2018年06月06日

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

今天,我们怀着诚心、真心、谦卑之心,以及「 让人们在数据世界里获得视觉能力 」的梦想,为大家奉上 G6 2.0。

G6 名字的由来

  • 流程图,流流流,666,溜溜溜?

  • G2 叫 G two。G6 叫 G six ?

  • G 是图形可以理解,6 跟关系数据有什么关系?

  • ……

由于这个问题被很多人问到过,所以在正式介绍 G6 2.0 的新架构,新特性之前,我们觉得还是有必要先介绍一下 G6 这个名字的由来。

  1. G6 的 G 来自于 Graphic、Graph ,意味着我们要基于图形技术做图可视化;

  2. G6 的 6 来自于《六度分隔理论》表达了我们对关系数据、关系网络的敬畏和着迷;

  3. G6 念 G六

裂变

配图来源:http://www.guancha.cn/XiangFan/2017_11_08_433921_s.shtml

自 G6 诞生以来,公司内部由 G6 承接的业务可以分为两大类,一者是 图分析 类,二者是 图编辑 类。两者虽说都是关系型数据,但两者的侧重点各不相同,前者更注重绘制的性能、布局的质量,数据钻取等分析体验。后者更注重命令操作、数据读存等人机交互的编辑体验。由于之前人力上和认识上的局限,1.0 中我们强行把两个场景全部揉在 G6 这一个库里,随着业务的发展,G6 自身变得越来越臃肿,越来越矛盾,发展变得举步维艰。团队同学经过深入讨论和思考,决定将 G6 一分为二,由此,G6 开始了工程上的裂变:

> 干活程序员:这绝对是一个蛮大的架构变化,甚至从工程上谈得上伤筋动骨,陷入深坑,有条件要上,没有条件创造条件也要上 ⊙﹏⊙

更完备

完备图项

2.0 中我们除了原有的两个基本图项(Item),节点(Node),边(Edge),还引入了另外两个基本元素:组(Group),导引(Guide)。至此,我们可以基于 G6 在思维完全不饶的情况下去画任何你想画的图。(意味着以后你可以再也不用偷换概念的去用节点模拟一个组,模拟一个背景,或其它什么东西。)

  • 群组 

  • 引导信息


层级拍平

G6 1.0 中节点和边位于两个图层,这个时候意味着,你只能让所有边都在节点上方或者都在下方。2.0 中我们将节点和边放在了同一个图层,这意味这你可以任意控制不同边和节点间的层叠关系。

更精简、更清晰、更友好的接口设计

随着 2.0 架构的升级,G6 沉为了底层的关系图可视化引擎,其本身不提供(很少提供)上层建筑(节点类型、边类型、基础交互、布局算法)的具体实现,只提供一套高可扩展的机制。得益此次的减负,G6 优化了大量接口设计,如果用过 1.0,相信大家能明显感受到接口更精简,更自洽,概念更清晰。详见:链接

开放插件扩展

为了更好的沉淀一些中等程度的、具体场景相关的工作,以及为了和社区更好的融合形成合力,G6 2.0 中我们开放了插件的扩展。详见:链接 。

聚变









在决定了 G6 未来上面会长 G6-Analyser 和 G6-Editor 两个独立项目后,我们深刻的明白,光靠工程是做不好上面两件事情的,我们需要更多与其它专业领域深度融合。

这次,我们很高兴的告诉大家,今天除了开源 G6 ,还会开放取得了阶段性成果的 G6-Editor ! 详见:链接 。

与设计深入融合

数据可视化可能一开始就跟美是分不开,而且我们又在 UED 部门,所以我们首先会想到和专业的设计同学深度融合。本次 G6-Editor 作为一个相对上层的中间件,其对外输出的一半是工程,另一半是设计。大家也许很难想象,为什么设计占了如此分量大,看完这篇 G6-Editor 交互设计沉思录,大家应能窥得一斑。

与产品深度融合

为了避免 G6-Analyser 和 G6-Editor 成为工程师闭门造车的产物。在打造这两个技术产品时,我们会和内部大量的商业产品深入合作,对各个交互细节反复推敲。最终将经过成熟的思考的结论内化到 G6 技术栈。

产品的深度合作,使得我们更有可能打造精品,并为未来打造开箱即用 图分析 与 图编辑 中间件打下坚实基础。

  • 内部分析应用 -- 河流图(数据虚构)

  • 内部分析应用 -- 流量网图(数据虚构)

开源·寄语

几经努力 G6 终于也走上了 开源 之路,心中小辛酸根本难掩内心深处的喜悦。希望开源之后能更好的回馈社区,更好的从社区中汲取养分,希望大家在使用过程中多看文档,善研代码,勤提PR,互帮互助,提有深度的问题,有建设性的建议。期待与大家共同努力,共同成长,共同进步~!

项目地址

官网:https://antv.alipay.com/zh-cn/g6/ 
Github:https://github.com/antvis/g6  

最后

夹带几个私货:

“此生与你赤诚相见是我莫大荣幸,往后的日子还请多多指教”                                                                                                             —— AntV / G6

原文链接

展开阅读全文
58 收藏
分享
加载中
精彩评论
终于等到你开源了。我们的 #PDMan#(https://my.oschina.net/skymozn/blog/1821184) 是基于G6做数据表的关联关系的,我们用的那会儿,他还没开源。于是给作者提了几个issue。我们也在今天的第一时间收到了G6开源的邮件通知,G6开源后,增加了很多新特性。我们也将会在下一个版本,使用上这些好的新特性。
2018-06-06 11:07
3
举报

引用来自“菠罗”的评论

终于等到你开源了。我们的 #PDMan#(https://my.oschina.net/skymozn/blog/1821184) 是基于G6做数据表的关联关系的,我们用的那会儿,他还没开源。于是给作者提了几个issue。我们也在今天的第一时间收到了G6开源的邮件通知,G6开源后,增加了很多新特性。我们也将会在下一个版本,使用上这些好的新特性。
踏破铁鞋无觅处,原来有这么好的东西
2018-06-07 13:53
1
举报
还是林峰
只是从百度到了阿里。
2018-06-06 21:27
1
举报
最新评论 (15)

引用来自“长沙大东家”的评论

还是林峰
只是从百度到了阿里。

引用来自“菠罗”的评论

是从哪里看出来的,是百度的林峰。我找了半天,没找到线索
阿里Buy+之后,蚂蚁金服也要用黑科技改变我们「买买买」的方式| 极客公园 www.geekpark.net/news/216966 Translate this page Oct 13, 2016 - 从「VR 支付」到「码上」,蚂蚁金服的技术创新只是开了个头。 ... F 实验室负责人林峰告诉极客公园:「目前VR 支付已经具备了商业落地的能力,最晚将 ...
2018-06-07 16:53
0
回复
举报

引用来自“长沙大东家”的评论

还是林峰
只是从百度到了阿里。

引用来自“菠罗”的评论

是从哪里看出来的,是百度的林峰。我找了半天,没找到线索
回复@菠罗 : Kener-林峰 Kener-林峰 1个月前 更新了动态 招前端,招可视化~ 蚂蚁金服数据可视化团队
2018-06-07 16:48
0
回复
举报

引用来自“菠罗”的评论

终于等到你开源了。我们的 #PDMan#(https://my.oschina.net/skymozn/blog/1821184) 是基于G6做数据表的关联关系的,我们用的那会儿,他还没开源。于是给作者提了几个issue。我们也在今天的第一时间收到了G6开源的邮件通知,G6开源后,增加了很多新特性。我们也将会在下一个版本,使用上这些好的新特性。
踏破铁鞋无觅处,原来有这么好的东西
2018-06-07 13:53
1
回复
举报
666
2018-06-07 12:27
0
回复
举报

引用来自“长沙大东家”的评论

还是林峰
只是从百度到了阿里。
是从哪里看出来的,是百度的林峰。我找了半天,没找到线索
2018-06-06 21:43
0
回复
举报
还是林峰
只是从百度到了阿里。
2018-06-06 21:27
1
回复
举报
不错的玩意
2018-06-06 18:09
0
回复
举报
G1-G6都有什么区别?
2018-06-06 15:07
0
回复
举报

引用来自“菠罗”的评论

终于等到你开源了。我们的 #PDMan#(https://my.oschina.net/skymozn/blog/1821184) 是基于G6做数据表的关联关系的,我们用的那会儿,他还没开源。于是给作者提了几个issue。我们也在今天的第一时间收到了G6开源的邮件通知,G6开源后,增加了很多新特性。我们也将会在下一个版本,使用上这些好的新特性。

引用来自“世尘悉洞”的评论

看了一下你的东西,感觉很牛啊。膜拜,我下来搞一搞。

引用来自“菠罗”的评论

如果没有G6,我们也不会搞PDMan,一次偶然恰好看到了G6,满足了我对蓄谋已久,对PDMan设计的功能。于是很快就启动了这个项目,并在第一时间推出。其他的功能都好做,主要是关系图比较能够直观的展示实体之间的关系,这是我最需要的。

引用来自“世尘悉洞”的评论

我终于不用开虚拟机用PD了。我也是用Mac工作,用PD只能开虚拟机。
一切还要依赖AntV-G6提供那么好的基础平台。
2018-06-06 14:55
0
回复
举报

引用来自“菠罗”的评论

终于等到你开源了。我们的 #PDMan#(https://my.oschina.net/skymozn/blog/1821184) 是基于G6做数据表的关联关系的,我们用的那会儿,他还没开源。于是给作者提了几个issue。我们也在今天的第一时间收到了G6开源的邮件通知,G6开源后,增加了很多新特性。我们也将会在下一个版本,使用上这些好的新特性。

引用来自“世尘悉洞”的评论

看了一下你的东西,感觉很牛啊。膜拜,我下来搞一搞。

引用来自“菠罗”的评论

如果没有G6,我们也不会搞PDMan,一次偶然恰好看到了G6,满足了我对蓄谋已久,对PDMan设计的功能。于是很快就启动了这个项目,并在第一时间推出。其他的功能都好做,主要是关系图比较能够直观的展示实体之间的关系,这是我最需要的。

引用来自“世尘悉洞”的评论

我终于不用开虚拟机用PD了。我也是用Mac工作,用PD只能开虚拟机。

引用来自“开源中国首席睡觉专家”的评论

@世尘悉洞 pdman是干嘛的?
你看看软件介绍就知道啦,类似PowerDesigner的设计工具,但是目前功能还没有PowerDesigner强大,但是可以让我的mac上运行起来,我看了一下功能还是很不错的。
2018-06-06 13:33
0
回复
举报
更多评论
15 评论
58 收藏
分享
返回顶部
顶部