蚂蚁金服开源：关系数据的可视化引擎 G6 2.0-InfoQ



 写点什么

小蚂蚁说：
首先回顾上一次蚂蚁金服 AntV 的相关开源消息：《蚂蚁金服开源：数据驱动的高交互可视化图形语法 G2》。
AntV 是蚂蚁金服全新一代数据可视化解决方案，主要包含「数据驱动的高交互可视化图形语法」G2、本次开源的 G6、适于对性能、体积、扩展性要求严苛场景下使用的移动端图表库 F2 以及一套完整的图表使用指引和可视化设计规范，致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践。
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 六

裂变

自 G6 诞生以来，公司内部由 G6 承接的业务可以分为两大类，一者是图分析类，二者是图编辑类。两者虽说都是关系型数据，但两者的侧重点各不相同，前者更注重绘制的性能、布局的质量，数据钻取等分析体验。后者更注重命令操作、数据读存等人机交互的编辑体验。

由于之前人力上和认识上的局限，1.0 中我们强行把两个场景全部揉在 G6 这一个库里，随着业务的发展，G6 自身变得越来越臃肿，越来越矛盾，发展变得举步维艰。团队同学经过深入讨论和思考，决定将 G6 一分为二，由此，G6 开始了工程上的裂变：

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

1.更完备

完备图项

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

群组

导引信息

层级拍平

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

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

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