知源 · 致远 - AntV 11.22 年度发布

时间 2019-11-29

标签 antv 11.22 年度发布繁體版

原文原文链接

导读

AntV 是一个数据可视化项目，也是一个团队，蚂蚁金服数据可视化团队，一群有爱有梦的人，怀揣「让人们在数据世界里得到视觉化思考能力」的梦想前行，但愿成就智能时代全球领先的数据可视化解决方案，知足与日俱增的数据洞察需求。前端

AntV 目前覆盖了统计图表、移动端图表、图可视化、地理可视化、2D 绘图引擎和智能可视化多个领域，主要包含 G二、G六、F二、L7 以及一套完整的图表使用和设计规范。得益于丰富的业务场景和用户需求挑战，AntV 经历多年积累与不断打磨，已支撑起阿里集团内外 20000+ 业务系统，经过了日均千万级 UV 产品的严苛考验，是阿里经济体数据可视化最重要的基础设施。node

跟往年的品牌日同样，今天依旧会有几个底层基础类库的大量更新发布，除此以外，很是高兴的向你们介绍 AntV 产品矩阵新添的三个成员：git

g2plot，一个基于 G2，开箱即用、易于配置、具备良好视觉和交互体验的通用图表库；
Graphin，一个基于 G6，专一关系可视分析领域的 React 组件库，简单，高效，开箱即用；
ChartCube，一个能够快速完成图表制做的在线工具，只须要三步就能够建立出高品质的图表；

他们都是 AntV 技术栈上的更高抽象的封装或应用，详见文稿详情。程序员

跟往年的品牌日不同，今年的品牌日主题为「知源 · 致远」，除了上述技术、设计的更新与发布，咱们真诚的向你们分享 AntV 团队的由来与发展历程，详见文末 AntV 全员出镜演绎的团队纪录片，匠心知源，同行致远。github

匠心打磨，是时候给你们一个图表库了

g2plot

g2plot，一个基于 G2，开箱即用、易于配置、具备良好视觉和交互体验的通用图表库。算法

G2 是一套基于可视化编码的图形语法，以数据驱动，具备高度的易用性和扩展性，用户无需关注各类繁琐的实现细节，一条语句便可构建出各类各样的可交互的统计图表。小程序

每一个人都能制做图表，但并非人人都能作出易读，好用又好看的优秀图表。如何从无聊的默认设置变成有洞见的数据图表呢？咱们融合了在商业智能（BI）中的可视分析与设计实践经验，基于 g2 的灵活、强大的可视表达能力，抽象经常使用图表类型封装出全新的可视化图表库 g2plot。结合真实数据，制做图表，获取专业的可视化。安全

咱们曾经说过 G2 是一个能够生产图表库的图表库，现在自证预言的推出 g2plot 除了具有 G2 无限可能的可视表达能力外，g2plot 最主要的特性还有：weex

**开箱即用：**默认好用开箱即用的高质量统计图表
响应式：针对各类分辨率的响应、文本覆盖、文本超出限制作了精心的设计
会讲故事的图表：提供了多图组合、叠加、联动，共同讲述一个数据故事的可能性

提早预告的还有 G2 4.0，在 G2 1.0 - 2.0 阶段咱们专一于图形语法，解决了数据到图形的映射问题，用户能够经过自由组合图形语法快速搭建各类图表。G2 3.0 随着业务对图表体验需求不断升级，咱们对图表组件以及交互进行了改造，提供了更加灵活的配置以及自定义功能。而这次 G2 4.0 对咱们来讲是一个很重要的新起点，咱们对底层架构作了大量的重构工做，当前 G2 4.0 Alpha 版本已放出，稳定版预计将在两个月后正式发布，她将是一个专业的、给用户带来更多可能性的可视化底层引擎，在保证图表优雅体验的同时，4.0 将会更加关注于：网络

图形语法，数据到图形的映射；
交互语法，交互同数据、图形的链接机制；
组件体系，面向交互、体验优雅；

更多关于 g2plot、G2 的最新进展见文末连接。

点线析源远，洞察关系数据

Graphin

_Graphin，取名自 Graph Insight，图的分析洞察，_一个基于 G6，专一关系可视分析领域的 React 组件库，简单，高效，开箱即用。

G6 AntV 旗下的图分析及图可视化引擎，G 来自于 Graphic、Graph ，意味着咱们要基于图分析技术作图可视化；6 来自于《六度分隔理论》，表达了咱们对关系数据、关系网络的敬畏和着迷。

目前图分析已经被普遍应用在金融反欺诈，公共安全，基础设施监控，智慧医疗等领域。在这个过程当中，咱们须要一个强大的图计算引擎，解决数据合规，挖掘问题。也须要相应的图算法去解决图的构建，分析问题。最后在前端，咱们须要一个图可视化引擎，为咱们提供可视化分析能力，发现潜在的价值。

Graphin 就是在这样的背景下诞生的，基于 G6 的底层能力一方面屏蔽掉一些领域专业的概念，同时又封装进去不少经常使用的图分析功能，进一步下降图可视化领域的专业门槛，将这些关系数据进行可视化分析与探索。Graphin 具备以下产品特性：

数据驱动：充分利用 React 框架特性，支持数据到图的映射与变化；
自动布局：内置丰富的布局，支持布局切换，知足不一样场景下的布局需求；
分析组件：内置 Toolbar，ContextMenu，MiniMap，Filter 等组件，组件化开发，支持自定义；
自定义样式：内置节点与边的样式，支持用户经过 JSON Schema 自定义；
基础分析：支持节点扩散，寻找边关系等基础分析方法；
高级分析：开源后计划新增时序分析（timebar），地理位置分析（map mode）等高级分析方法。

值得一提的是，G6 从 18 年开源到如今已经第 2 个版本，从基础关系图绘制到图分析与图编辑底座，而在 3.1.版本后的 G6 已从新聚焦在图分析方向，咱们将会给出另一个产品去承载图编辑方向的需求。有了这个改变，今天咱们带来的 G6 3.2 版本可以更聚焦的提供：

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

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

丰富的内置元素。🆕菱形、三角形、星型、卡片型节点。🆕arc 型、自动弯折的折线型边。

自定义元素及辅助展现及分析的组件——🆕边绑定。

更多关于 Graphin、G6 的最新进展见文末连接。

图表制做能够很简单

ChartCube

ChartCube 是一个能够快速完成图表制做的在线工具，只须要三步就能够建立出高品质的图表。

图表制做——这个最多见却也五花八门的需求，每每由于工具的领域闭塞性而变得麻烦。虽然设计师能画出任何形式的图表，但他们经常遇到要作数据的批量改动而手抖；虽然分析师可使用办公软件熟练地制做图表，但他们会由于静态的图片不能交互而发愁；虽然程序员能够绘制高可用的交互式图表，但他们经常为了学习代码类库而挠头……让你在制做一张简单图表时感觉到挫败的，一般是一个浅浅的门槛。这个门槛多是“图例怎么对不齐”，也多是“数据怎么行列转换”，还多是“分析这个目标我该用什么图表”……困扰你的是哪种？

为了让 AntV 多年沉淀的专业技术能够一步服务于你，咱们开发了一个在线工具：图表魔方 ChartCube。

你能够彻底不懂如何处理数据，你能够没据说过任何图表类库，你也不须要写一行代码。经过最直观的交互，你都能制做出你须要的图表。

也许你想为你的运营文章制做一张插图，也许你须要一份知足格式要求的数据，甚至你须要一份直接插入网页的代码，ChartCube 都能支持。

利用 ChartCube 制做图表，过程很是简单。一般你只须要三步：选择图表、配置图表、导出图表，欢迎试用。
更多关于 ChartCube 的最新进展见文末连接。

优雅的 AntV 设计来了

优雅的视觉、交互与制图

过去一年咱们在统计图表、关系可视化、地理可视化、图表制做以及可视化站点方面投入了大量的设计资源，今天已连同上述各个产品一块儿对外发布。而今年 AntV 设计的关键词为“优雅”，咱们但愿在视觉、交互与制图三方面给你们带来些优雅的设计。

在优雅的视觉设计里，咱们最大的改进是对信息过载的处理，如智能检测，以数据标签为例，数据标签若是不知道它的背景色是深是浅，是疏是密，就会出现标签过密、颜色看不清等系列问题。此次产品发布中，标签结合颜色检测、碰撞检测、图形检测、超区域检测，咱们已能解决这些问题。除此以外还有符合美学选择和专一的全新视觉样式，不少人期待的 Dark Mode 也会到来，将与 Ant Design 相关组件、页面无缝融合，总体和谐优美。

在优雅的交互设计里，AntV 在构建响应式系统时结合 Responsive design 与 Adaptive design，遵循宏观层面保证核心信息优先展现，微观层面保证全部尺寸下细节信息都有能力获取到交互两条基本原则，使得小到 mini 图表，大到大屏显示，AntV 总能保证重点信息不丢失的同时轻松胜任各类尺寸、多种设备。同时，交互语法的加强使得 AntV 在叙事能力有了进一步提高。

在优雅的制图设计里，AntV 一直致力于提供研发套件，这回咱们把关注点聚焦到设计师身上，让设计者进入图表制做的全面提效时代，Sketch 插件 Kitchen 以及上面介绍到的 ChartCube，只需 10 秒，轻松作出优雅图表。

更多关于 AntV 设计的最新进展见文末连接。

知源 · 致远

这是 AntV 发展的第 5 个年头，从 2014 年第一位工程师的白手起家，到 2017 年第一个项目 G2 开源，现现在咱们已经有了 7 个产品，几十个项目在 GitHub 上发布，团队的规模也从 3-5 我的发展成横跨蚂蚁多个前端、设计部门 30+ 人员的专业团队。

5 年来的起伏跌宕虽然不能说波澜壮阔，但倒是咱们生命中永不磨灭的印迹，藉由这 4 分钟的视频与你们分享过去这5 年 AntV 团队所经历的欢喜与失落，专一、专业、坚持，但愿对这份匠心的知源，能与你们并肩同行致远。

更多详情见「知源 · 致远 - AntV 的那些人，那些事儿」

结语

过去一年咱们从底向上重构了绘图引擎 G，重写了全部的组件（Axis、Legend、Annotation等），对 G二、G六、L7进行了重构，解决了各类复杂的数据场景适配问题，向着可视化工具开箱即用的方向发展。

咱们看到各个产品的界限在不断模糊，传统图表和关系图混用、地理场景上的关系分析、多端融合要求咱们不断的从渲染引擎、组件、数据处理层面进行重构，使用户能够无缝的对各个产品进行整合，智能可视化对可视化研发、设计、产品的影响已经出现，颠覆性的产品可能很快就会脱颖而出。

咱们已经作好准备了吗？尚未，但咱们已经在行动，咱们是 AntV，蚂蚁金服数据可视化团队，一群有爱有梦的人，怀揣「让人们在数据世界里得到视觉化思考能力」的梦想前行。

AntV，知源 · 致远！

-------------------------

附

AntV 品牌日的发布详情

AntV 项目连接

欢迎关注咱们的 GitHub 项目，点亮 star 了解咱们的实时动态，期待 pr：

AntV 官网：antv.alipay.com
G2：github.com/antvis/g2
G2 是一套基于可视化编码的图形语法，以数据驱动，具备高度的易用性和扩展性，用户无需关注各类繁琐的实现细节，一条语句便可构建出各类各样的可交互的统计图表。
g2plot：github.com/antvis/g2pl…
g2plot 的定位是开箱即用、易于配置、具备良好视觉和交互体验的通用图表库。
F2：github.com/antvis/f2
F2 是一个专一于移动，开箱即用的可视化解决方案，完美支持 H5 环境同时兼容多种环境（node, 小程序，weex）。完备的图形语法理论，知足各类可视化需求。专业的移动设计指引为你带来最佳的移动端图表体验。
G6：github.com/antvis/g6
G6 是 AntV 旗下的图可视化与图分析引擎_，_G 来自于 Graphic、Graph ，意味着咱们要基于图分析技术作图可视化；6 来自于《六度分隔理论》，表达了咱们对关系数据、关系网络的敬畏和着迷。
Graphin：github.com/antvis/grap…
Graphin 是一个基于 G6 封装__的关系可视分析工具_ __，简单，高效，开箱即用，_取自 Graph Insight，图的分析洞察。
L7：github.com/antvis/l7
_L7 是一个基于 WebGL 的开源__大规模地理空间数据可视分析开发框架。_L7 中的 L 表明 Location，7 表明世界七大洲，寓意能为全球位置数据提供可视分析的能力。
G：github.com/antvis/g
G 是 AntV 几个产品共同的底层 2D 渲染引擎，高效易用，专一于图形的渲染、拾取、事件以及动画机制，给上层 G二、F二、G6 提供统一的渲染机制。
ChartCube：chartcube.alipay.com
ChartCube 是一个能够快速完成图表制做的在线工具，只须要三步就能够建立出高品质的图表。