AntV
首发于AntV
进无止境,AntV 统计图表 G2Plot 1.0 发布

进无止境,AntV 统计图表 G2Plot 1.0 发布

G2Plot 是一个开箱即用、易于配置、体验优雅的统计图表库,致力于帮助用户以最小成本生成高质量统计图表。


G2Plot 最初诞生于阿里经济体 BI 产品真实场景的业务诉求。动态、高度不确定是 BI 产品和中台系统业务数据的一个普遍特征,而这种特征对统计图表的功能和体验提出了巨大的挑战。如何能够帮助报表系统和一线前端在复杂数据条件下快速高效地创建统计图表,同时保证图表在各种显示空间和数据状态下的可读性和可用性? 为解决这两个痛点问题,AntV 与 DeepInsight、QuickBI 和 FBI,阿里经济体三个优秀 BI 产品技术团队联手打造了 G2Plot。

自去年 11 月发布 0.x 试用版后,G2Plot 经历了 20 多个小版本的迭代优化,图表类型已从最常用的 7 个扩展到 40 多个,在核心 BI 产品真实场景上线验证后终于带来 1.0 正式版。希望我们在数据可视化业务,特别是 BI 产品中的开发和设计经验能够帮助到更多用户轻松制作优雅的统计图表。

特性预览

简单易用

图形语法是统计图表的奠基理论,具有完备、灵活、无限可能的可视表达能力,全球顶级 BI 系统的可视分析实现基本都以此理论为基础,G2 可以说是 JavaScript 领域最完备的图形语法实现,也因此成为很多专业可视分析应用的首选技术方案。然而,对于应对大部分常规应用,对于大部分工程师、设计师和产品经理来说,学习理解“视觉通道”、“坐标系变换”、“数据映射”等专业可视化概念需要付出相当高的学习和时间成本。在统建阿里数据可视化基础设施的大背景下,AntV 与阿里经济体多个团队联合共建 G2Plot 应运而生,构建在 G2 强大的可视表达能力之上,采用大家熟悉的配置化、描述性 API,为使用者屏蔽可视化专业知识,用户只需要引用相应的图表,指定数据和配置字段即可通过数据驱动的方式生成图表。


简约而不简单的精雕体验

今年1月4日在杭州西湖文体中心,第三届 SEE Conf 蚂蚁金服体验科技大会上,AntV 核心研发工程师,同时也是 DeepInsight 的数据可视化方向负责人小为给大家带来了精雕细琢,打造极致可视化图表体验的精彩分享,还没看过的同学强烈推荐看看。分享中已经提前剧透了 G2Plot 的大量体验优化细节,G2Plot 每一个线上图表都经过了细心雕琢,我们会在关注图表自身特点的基础上,根据不同的使用场景、显示空间、数据特点针对图表的细节和体验进行精心打磨。


图形

继承 G2 无限可能的特性,G2Plot 拥有丰富多样的图形扩展。



通过对数据进行剪枝处理和相关点简化算法,对大数据量和极小显示空间等特殊场景进行图形优化。

交互

我们把一些常用的复杂交互进行了内置,用户不需要再自行封装,只需调用相关配置项即可使用。同时,我们还把细粒度的事件机制,画布、图形、组件交互能力全方位透出以方便用户高度个性化定制。


图表联动交互



数据钻取交互
数据筛选交互

动画

我们根据每一个图表自身的特点和使用场合,精心设计了一些动画效果,让图表更加灵活生动。这些复杂动画效果都已内置,可以通过配置项和图表方法直接调用。同时,我们还提供了细粒度的动画配置,用户可以通过指定动画类型、时间、缓动效果,自由控制图表的入场、消失和数据更新动画效果。

更新动画
"你追我赶"的入场动画

组件

响应式组件,在现实的图表应用场景中,一个棘手的难题是图表的展示空间往往并不足够显示图表的数据量,造成极值情况下文本的重叠遮挡内容无法自适应内容裁剪等问题。G2Plot 借鉴宽容性设计的思想,在图表的信息密度过高时,对图表组件信息进行抽稀、省略、调整,保证图表主要信息的展示和基本可读性


内置统计分析高级组件,在一图一做、细致打磨的过程中,我们根据每一个图表的特点,将使用图表进行统计分析时常用的组件进行了封装,内置进G2Plot。

堆叠柱状图(联通区域组件)
热力图(滑动锚点图例)

体验对比

下面是 G2Plot 与几种常用图表库的效果对比:



默认好看与灵活配置并重

基于 AntV 设计语言,一套提炼自企业级产品的视觉语言和设计规范,G2Plot 根据每一个图表自身的特点沉淀出一套默认配置,保证每个图表在开箱状态下,呈现给用户的就是最规范、最优雅的状态。Good by Default 的同时,G2Plot 开放细粒度的图表配置,无论图形样式、各类图表组件、文本显示还是图表事件,用户都可以根据自己的业务场景生产个性化图表。

最后

非常感谢你的耐心阅读,G2Plot 发布 1.0 版本只是一个开始,虽然已经在 DeepInsight 等 BI 产品中应用上线,但相信还有很多问题有待打磨和完善,欢迎在 GitHub 给我们反馈问题。如果你对 G2Plot 或者 AntV 旗下的其他产品感兴趣,可以通过以下渠道关注我们:

发布于 2020-03-17

文章被以下专栏收录

    Ant Design 是一个致力于提升「用户」和「设计者」使用体验的企业级设计体系,利用统一的设计规范、前端实现、设计/研发工具链对产品研发赋能,全面提升企业级产品的使用体验和研发效率。