G6 目前已经成为阿里经济体的图可视化基础设施，这其中离不开业务线小伙伴们的支持与帮助。网商银行的 #镜曦，#千竹，结合自身业务规划了 GraphMaker，作为 G6 的交互式文档来使用，有效提升了开发效率。大数据部的 #山果 同学，基于图分析业务孵化出 Graphin 组件，成为 G6 React 生态的重要一环，帮助业务开箱即用。阿里云的 #佛肚 同学，基于 Graphin 完成了图可视分析业务的开发，深入参与并主导了 Graphin 的迭代开发。在 #佛肚 和 #镜曦 的邀请下，#耳铃、#六一、#阁乐 也相继参与到 G6 的共建中来，随着 #完白、#不过、#源子 的持续投入，融合阿里与蚂蚁两种设计体系，产出了针对 G6 的图可视化设计规范。布局计算的效率问题，成为 G6 一道绕不过的坎，正是 #沧东 提供的 GWebGPU 引擎，使得借助 GPU 来完成 G6 的布局计算成为可能。蚂蚁知识图谱的 #依枫、#轩与 同学，利用 AI 能力解决业务的布局推荐问题，沉淀为可视化预测引擎，帮助 G6 实现智能布局预测，成为 G6 迈入智能化的重要标志。
还有太多太多的业务方同学，比如 #牵尘、#天授、#毅羽、#康奎、#度心，将业务中的 G6 实践，结合业务思考，沉淀为一份份的图可视化解决方案白皮书，告诉更多的使用者，图可视化是什么，G6 能为图可视化做什么。甚至还有些业务同学，比如 #牵尘、 #育生、#书鱼，虽然他们的业务暂时没有使用 G6 的场景，但是依然凭借着对图可视化的兴趣与热爱，不断为 G6 布道，关注 G6 的成长与发展，这些都是 G6 宝贵的业务伙伴，是 G6 最宝贵的财富。
在 G6 的能力结构中：组件生态、文档、性能，设计规范、智能化、最佳实践、解决方案白皮书、人才布道等诸多方向，都离不开业务伙伴的支持，这也许就是 G6 最令人感动和欣慰的业务故事，一群志同道合的小伙伴，一起为了梦想而奋斗。
每个同学对自己的业务、对图可视化、对 G6 都有自己的理解，让我们作为一个旁观者，来一起来听听同学们内心最真实的想法吧。
爱下厨的工程师-山果
在 2018 年 12 月，我们内部业务启动了一个图分析产品，选用 cytoscape.js 作为图分析引擎。随着项目的持续迭代，我们意识到了项目中对于图可视化的需求与定制越来越高。正值 G6 3.0 版本刚刚发出，此刻面临选择：一面是国外成熟稳定的图可视化引擎，一面是蚂蚁自研的图可视化引擎。是业务优先，还是给自研技术落地的土壤。我们最终选择了“既要又要”（又是阿里的土话），我们在技术上做了一层适配层，把 G6 和 cy 的 API 做了层抽象，上层的数据管理，交互与渲染可以无感知底层调用 cy 还是 G6 的 API，保障业务既可先上路，也可扩展。在项目二期，我们两套引擎并存，白名单下，用户可以在页面上一键切换。这个双引擎的适配器，就是最初 Graphin 的雏形。
Graphin 最初的想法是成为 G6 React 生态的一部分，因为图可视化这个门槛还是挺高的，当时 G6 还没有布局，一个简单的圆形布局，调用数学里的三角函数就可以解决，却花了我一下午的时间思考，怎么也转不过弯。还有交互，分析组件，都是 G6 所缺少的， 因此 Graphin 希望在内部的 React 体系内，将这些都集成进来，让用户开箱即用。
后来随着业务的发展，更多的业务小伙伴加入进来，在交流中，我们的认知又提升了，G6 逐渐强大，目前已经是国内最好的图可视分析引擎。Graphin 要践行它 Graph Insight 的名字，完成对图的深入洞见，因此，今年 11.22 开源日推出的《AntV 图可视分析解决方案》就是一个开始，所有做图分析的小伙伴们一起共建，将我们的业务思考，产品方案，设计规范，技术方案，沉淀为一份指导性的文档，也算是抛砖引玉，勉励更多同行者一起前行。而我也在今年 10 月份通过组织调整加入 G6 团队，一起参与 G6&Graphin 的建设。
希望一稿过的-不过
认真划水的设计师
2019 年 1 月入职的第 2 天就开始接手做知识图谱的产品需求，摆在面前最大的一个设计挑战就是当时的产品用的是外部的图组件，在交互体验和视觉呈现上都非常糟糕。偶然的机会知道内部有 G6 的组件，便跟当时的 G6 开发 #清楠 提出了业务上的诉求，和设计上的一些想法，过程中也不断的说服业务前端替换为 G6 。由于当时的 G6 功能还不是非常完备（布局能力和相关文档不全），加上业务前端同学对可视化组件的熟悉程度有限，曾一度用了 G6 之后又倒车回退到外部的图组件。直到一段时间后，看到当时的关系网络产品中图的效果比彼时的知识图谱上用的组件效果好很多，又再一次牵线搭桥，让知识图谱的技术、PD、设计一起和关系网络的开发同学第一次有比较正式的沟通，并在此次的沟通基础上，我在当时的沟通会提出了在图分析组件层面统一体验设计的想法，并晒出当时并不成熟的一些设计思路。在此之后，知蜘正式从外部图组件迁移到基于 G6 衍生而来的 Graphin，并再次基础上不断拓展图分析的各项能力，成为了关系图的重要使用案例之一。
后随着业务的变动，又在图可视分析项目中跟 G6 的前端负责人 #聚则 有了更多的沟通，便在支持图相关的业务需求之余，也零散的参与到 G6 的设计过程中，彼时无论国内外都很少有能直接参考的图和图分析相关的设计资料，团队内此前这类的关系图的业务设计经验也极少，且此前没有可视化设计的经验，只能通过不断的扒国内外的竞品和文档书籍摸着石头过河。并在 2019 年 AntV 品牌日之前起草了 「G6 图可视化设计体系」的框架和非常初步的草稿内容，正准备大干一场把在业务中的经验沉淀总结为完整的图设计体系时，随着组织和业务的拥抱变化，重心着力在其他非图的业务和专业方向，刚列了一个大纲的设计体系也随之搁置。随着 2020 年品牌日的进行，得知在图设计这块 #耳铃、#六一、#阁乐 都正在积极地将各自图业务中的设计实践，反哺到 G6 的设计时，便借此机会再次参与 G6 设计指引的内容撰写，这一次跟不同 BU 的设计师一起，为这一前人经验几乎为空白的设计领域添砖加瓦，希望能为后续新接触此类业务和场景的设计师提供一些参考，也为 AntV 增添一些羽翼。
不务正业的设计师-耳铃
人类的赞歌就是勇气的赞歌！
说起来受 #佛肚、#聚则 邀请加入 G6 是我的荣幸。源于对图可视化的兴趣，以及基于支撑阿里云研发及治理平台相关数据业务—— DAG 拖拽节点搭建、节点式数据运维和大数据数据血缘等为基础，并在 2019 年和前端 #佛肚 在 G6 2.x 版本的底座之上完成了海量数据图智能搜索和关系分析的业务，将图可视化的业务过程完整落地到公有云，为各行业提供管控和关系分析能力，并反哺推进 G6 3.0 图布局。刚开始做这块业务也很懵，对图模型设计和业务交互形式有过很多错误的尝试，不断学习国内外优秀的竞品和文档（国内的较少），一步步总结和打磨沉淀革新。
所以今年在 #佛肚、#聚则 的邀请下，我提起了勇气依靠着自己非专业的业务经验重新吆喝起了 G6 4.0 update 浪潮，将 G6 的图设计体系重头整理起来。毕竟在图可视化的领域里面没有真正完整的体系得以借鉴，只能先将基础的样式和交互落地，然后挖掘各行业的业务诉求，按照我们的目标逐一突破。11.22 是 AntV 的品牌日，在这个隆重的节点上我们需要完成图设计指引和白皮书相关内容撰写，此时我的感觉是很虚的，仅依靠接触到的业务和沉淀的经验把文字写下来，没有专业的信服力，但是这件事我们还是做了，仅仅是因为相信，和一群志同道合且优秀的人一起，在这个领域上我们可以为相关业务的企业带来更多的价值，可以在图可视化这个领域发现更多好玩且有意义的事情。
喜欢徒步的摄影师-镜曦
从起点开始，直到终点，然后停下。
我是 2018 年 S1 开始投入在可视化方向的。那个时候各种数据及中台的业务兴起，网商的数据产品还处在蛮荒阶段，由于合规的原因，网商的业务相对于蚂蚁来说相对独立，而又有自己的特点，于是比较完整的做了包括商业分析平台、大屏系统，基于图的可视分析系统和基于系统调用关系的故障定位系统等各类的数据可视化的产品，也正是这个过程开始接触图可视化和 G6。
还记得当时 G6 3.0 还在规划，需求是通过 G6 2.0 的版本来进行开发。那个时候刚开始接触图可视化的业务，用 G6 也比较顺利的把业务 1.0 的版本实现了，只是在需求上砍掉了两个功能：一个是布局不理想，一个是节点和边的动画效果，虽然整体效果上也满足了业务上的需求，但是没有能超过预期。1.0 的版本我在布局上花了很大的力气也没有找到一个合理的布局算法，最后就去看开源的布局算法代码，自己定制。G6 2.0 的时候，对于我们业务方开发来说提供了图的基础渲染机制，要做的漂亮出彩需要投入非常多的精力和事件。那个时候我才刚刚接触图的研发，所以那段时间的感受记忆深刻。
到了 S2 的时候，很快 G6 3.0 的项目开始正式上了正轨。记得那个时候找 #萧庆、#青湳 聊我业务上的需求和我们希望通过 G6 达到的效果，结果第二周就直接给我想要特性的 DEMO，于是这块特性很快在业务上落地，业务方反馈非常好。那个时候 #聚则 来了，G6 里的第一个版本的分组功能也来了，后来 #十吾 也来了，G6 3.0 发展开始进入快车道。这个过程中 G6 也越来越易用，越来越专业。
对于我来说 G6 和 G2 同样基于 G 的架构给了我很多的可玩性，在 G6 还没有正式接入 G2 的图表的时候，我们就尝试将 G6 的 Node 使用 G2 的图表来表达更多维度信息，最后落在业务里效果非常惊艳。因为这样的可能性，我就想是不是可以做一个工具直接绘制 G6 的 Node 和 Edge，进一步有扩展到布局的可视化调参，这个想法就是后来的 GraphMaker。目前 GraphMaker 是作为 G6 的交互文档存在，后续补充上自定义节点和边之后大家就可以更方便的开发自己的图可视化应用了。
减肥成功的胖子-佛肚
佛肚没佛肚
DataWorks 产品体系从设计之初就与图有着紧密的联系，无论是字段映射、SQL 分析、任务编排、任务调度、血缘分析等无一不是通过图的交互方式来解决。这些场景强依赖图引擎的功能完整性、易用性、扩展性、性能，在使用 G6 之前，我们为了满足不同模块的不同诉求常常不得不采用不同的引擎，如 D3.js、jsPlumb、JointJS。这不仅造成较高的迭代成本、较低的性能，而且很难达到预期效果。
后来我们看到了 G6 2.0/G6 Editor 的方案，酷炫的效果、简洁的 API、灵活的定制性一下子就吸引到了我们，随后在与 #萧庆 老师沟通之后，确定下以 G6 + G6 Editor 作为我们整个业务图引擎的底座，随后在这之上演进出的GPlus 引擎几乎 100% 满足 DataWorks 所有的图相关的业务诉求。
到了 2019 年 3 月份我们开始进入图数据库领域，进行一站式图开发平台的研发。虽然当时国内图数据库领域已经非常火热，图数据库领域的可视化能力还是非常薄弱，在阿里我们看到的最多的就是 D3.JS 加一个力导来呈现查询后的结果：可读性差，完全不具备可分析能力。随后我们基于 G6 3.0 做了第一个版本，能够实现基于 Gremlin 语言查询结果的可视化，且具有一定的探索分析能力。但是当时的 G6 3.0 刚发布还没有布局能力，而 D3 的力导布局默认参数布局出来的图又有较大抖动，对于探索分析能力的支持有限。
随后在下一个迭代版本的技术调研时我们发现了 Graphin。当时 Graphin 对我们最大的吸引力就是力导布局的深度优化，应用层不需要做太多调整便能实现一个还不错的布局效果，内置的交互分析能力也极大的减轻了我们后续的研发工作。目前 DataWorks 的图可视分析模块完全基于 Graphin 构建，基本能够满足日常的图分析类业务。
在使用 G6/Graphin 过程中，接触到了 G6/Graphin 的核心开发同学 #聚则、#十吾、#山果，见到了图这个领域更多的可玩性。这些图领域的知识在帮助我推进 DataWorks 图业务的发展的同时，也激发了我对这个领域的兴趣，随后参与 Graphin 1.x 的功能迭代、图可视化白皮书相关内容的撰写。现在随着越来越多的小伙伴的加入，G6/Graphin 的目标也越来越清晰、图可视化在各个业务域的应用也越趋规范化、标准化。也期待更多小伙伴加入这个团队，一起来发掘这个领域的更多可能性。
爱动漫的宝儿姐-牵尘
我还是从前那个少年，没有一丝丝改变，时间只不过是考验，种在心中信念丝毫未减。
我和图结缘于学生时代， 当时的科研课题是基于机器学习的股票聚类分析，当年用 Echarts 渲染出第一个股票关系网络图时的激动依然历历在目。我和小伙伴基于阿里云的 ECS 学生机搭建了一个可视化的股票关联分析平台免费提供给外部使用，使用者只需要输入自己感兴趣的股票并勾选特征，就能得到股票的关系网络图。我们的小尝试意外地收获到了很多陌生人的鼓励和赞助，5 块、10 块的这些自发赞助让我第一次感受到了莫大的成就感。也是这个契机让我对图可视化产生了兴趣。
加入阿里之后，安全领域有着丰富的图可视化场景，不论是攻击分析、威胁情报、安全自动化编排（SOAR）还是资产和业务的可视化管控，都和图可视化紧密相连。2018 年我们的安全运营平台需要提供高效的开发模式来支持云产品的威胁建模和告警自动化响应脚本的编排流程，经过调研之后选择了 G6 Editor，视觉的美观度、节点的可扩展性和灵活的交互很好地支撑了我们的业务需求，不仅提升了架构安全评估效率，也降低了运营同学编排脚本时的编码门槛。
2019 年我们启动了一个基于图计算和图可视分析的项目，在考虑到对复合节点、轻编辑模式、节点多选和两个节点之间支持多条边的支持情况对比后，放弃 G6 选择了 cytoscape.js 做图渲染引擎。在这个项目上线后不久 Graphin 横空出世，提供了一整套较为完整的图可视分析解决方案，也认识了 #山果 和 #聚则 同学。虽然我们的项目没有选择 G6，但是从垂直业务领域的实际需求出发，我们一起沟通了对于 G6 / Graphin 的一些想法，从那之后也保持着技术上的沟通交流，非常给力的是 G6 和 Graphin 的同学对来自垂直业务领域的诉求能够快速地吸纳并迭代到 G6 / Graphin 中。
今年非常荣幸应 #山果 的邀请，参与了图可视化解决方案白皮书里面的云安全白皮书建设，安全领域的图可视化是一个非常重要但没有被很好重视的领域，也希望借这个机会吸收更多人的想法，做出真正能解决用户痛点的产品。
手指纤长的码农-康奎
可视化攻城狮
之前我一直从事机器学习、关联图谱、任务编排等相关的可视化工作，是 jsplumb、D3、Cytoscape.js 等可视化库的忠实用户。期间我也关注过 G6，但是彼时的 G6 还是一个非常不成熟的库，性能很差，而且也没有各种布局算法，更谈不上对图论算法的支持，所以我从未使用过 G6。
加入阿里后，我负责的是图编辑和图分析可视化相关工作，此时应该是 2020 年三月，这时候我又重新去看了一下 G6 的官网。这时候 G6 已经完全不是当初的模样了，首先性能应该有了进一步的提升，并且也支持了各种不同类型的布局，唯一不足的可能就是在图论算法方面可能还有很多不足之处。但是这都不是事儿，因为当时我对图论的各种算法还是比较熟悉的，自己实现起来问题也不大，并且 G6 也能满足大部分的业务需求了。因此，毅然决定在业务中使用 G6。在使用过程遇到了各种各样的问题，期间 #十吾 一直耐心帮忙解决，在此表示深深感谢！
之后我在负责图分析业务时，#山果 和 #佛肚 同学找到了我们团队，于是我就开启了与 Graphin 同学的合作共建之旅。期间也参与了图可视化解决方案白皮书的编写工作。Graphin 意为 Graph Insight 图的分析洞察，象形 Graphene 石墨烯，蕴藏未来的潜力。是一个基于 G6 封装的 React 组件库，专注在图分析领域。之后我会结合自身业务，将更好的图分析解决方案沉淀到 Graphin。
沉迷逛吃的工程师 - 多牧
外表看似前端，日常却在与计算引擎反复纠缠的工程师 —— 多牧，愿天下所有实时作业都没有延迟。
在来到蚂蚁实习前，我基本是零可视化经验的状态，G6 算是我在可视化路上的第一盏指路灯吧。本科毕业后作为计算引擎平台唯一的前端开发兼产品设计，需要将大量底层的概念，转化为大家直观而且易懂的图形界面。SQL 执行计划，数据血缘关系，作业流程编排，拓扑计算逻辑设计……这一个个可视化的需求，也让 G6 成为我工作中不可或缺的有力工具。从 1.0 升级到 2.0 再到 3.0，也算是陪伴着 G6 不断的成长，手上的需求也随着 G6 逐渐升级，G6 也陪伴着着我实习，转正，拥抱各种各样的变化。
G6 在不断更新中，功能和架构也不断的完善。但是身边还是有很多同学使用 G6，遇到了很多问题，有时甚至新增一个自定义节点需要一两天的时间才能编写完成。要是能像写 H5 一样自定义节点就好了，于是我就开始了向 G6 贡献相关的 JSX 自定义节点方案，逐渐不断的学习可视化相关的知识。我发现现在不仅是 G6 带着我成长了，我们变成了相辅相成的关系。
虽然手上的业务一直都没变，但是我的架构一直都在变化，赋予着我不同的期望和使命。话说这变化拥抱着拥抱着，我也慢慢接近了 G6 开发的核心大佬们，希望以后能够给 G6 赋予更多的能力，打造出更好用的 G6，早日让 G6 成为业界南波万～
喜欢潜水的弓箭手-六一
致力于影响他人，喜欢合作。
我是一名设计师，2018 年 12 月进入网商工作以来便跟随 #镜曦 着手可视化的工作。我的主要工作是基于 AntV 的交互式可视化和静态可视化，内容包含传统数据商业分析、数据大屏等数据产品，以及基于图的分析、基于系统流量关系的故障分析等各类数据可视化和分析产品。
亲历 G6 从 2.0 版本逐渐成长到 3.0 ，设计元素在图可视化中变得越来越自由，这让我更加喜欢探索数据艺术的世界。我希望让人的注意力更加集中在数据对应的视觉通道上，用视觉语言了解数据态势的全貌。在学习国内外可视化作品的过程中，我产生的「也要让 G2 基础图表展现在 G6 的Node 上」的想法，从最初的手绘草图变成设计稿，最后在前端同学的协作下落地实现成了 G6 的自定义节点，受到了一些认可和表扬。在这个过程中，我发现我的激情在于更具创造力的图可视化类型，而不是仪表板。
随着可视化业务数量的增长，今年产生了 G6 编辑器的需求——一个能够直接调整 G6 布局、Node 和 Edge 参数的工具，于是就产出了目前的 GraphMaker 。虽然 GraphMaker 暂时作为 G6 的交互式文档存在，但当补充完自定义 Node 和 Edge ，以及后续升级的产品功能，相信能给大家带来更便利的使用体验。
转眼到了今年 11.22 AntV 品牌日，以上业务经验让我有幸加入本次 G6 4.0 设计体系的建设团队，复盘自己的思考和沉淀，并整理进全局样式规范和《AntV 图可视分析解决方案》白皮书。这是一次按照「在打破规则之前先了解规则」原则的学习最佳实践，虽然不够详尽和完美，但希望能够借此引起更多优秀伙伴的关注，一起坚信图可视化市场是独特而迷人的，共同参与 AntV 的研究和创造。
结语
最近在和几个同学沟通的时候，当问起他们，了解过 G6 吗？很多人的回答都是，“知道，简单看过，感觉功能太少，性能比较差，以为你们不维护了”等等，当再问到，什么时候看的时候、看到是哪个版本时，大多数人的回答是 一年前吧，3.0.x 的版本。 不可否认，上面的这些问题在 G6 身上都存在过，G6 3.0 开发初期，GitHub 上的提交记录是中断了的，再加上 G6Editor 的不再维护，会导致部分用户认为 G6 也不维护了，所以他们在技术选型的时候就将 G6 排除在外了，甚至不惜自己去造轮子。G6 3.0 最初的几个版本，由于处于开发初期阶段，功能特性比较少，性能也比较差，关于 G6 的种种问题我们在使用过程中也深有感触。
从 G6 3.3 版本开始，G6 从布局、状态、组件、交互等多个方面进行持续迭代优化，到现在的 G6 4.0，功能上相对比较完善，我们也提供了开箱即用的 Graphin，但仍然有很多用户对 G6 的印象还是停留在 2019 年上半年，要去改变这种印象很难，唯有让 G6 变得更好。我们想和大家说的是：G6 不再是之前的 G6，它在功能特性、易用性及性能等方面都有了很大的提升，勇敢尝试一次，也许就会有新的发现。
针对 G6 本身，我们从来没有把它仅仅定位为一个图可视化的库，我们希望它能承担更大的责任，能够成为图可视分析领域的解决方案。因此，我们也开始在探索新的应用领域，如大规模的图可视分析、时序图可视分析及智能化，我们今年推出了《AntV 图可视化解决方案》系列的白皮书。
G6 4.0 依旧会存在种种问题，不够完美，以后的 G6 可能也不会太完美，我们希望能够有更多对图可视化感兴趣的同学参与进来，让我们一起努力把它变得完美起来。
若有收获，就点个赞吧
0 人点赞
