发布稿 - G.jpg


导读

各位朋友,欢迎来到 AntV 图表工厂。


数据可视化的家族成员中,统计图表恐怕堪称最为亲民和忙碌的一个:企业中台、 报表、大屏、BI工具都少不了它,地铁上无聊刷个新闻、查个天气都能顺便看见它的身影。无论是作为一个图表的使用者,还是图表的开发者,相信很多朋友都已经对统计图表的存在司空见惯了。


尽管乍看起来“平平无奇”,但真正使用起来,统计图表却并没有那么简单。我们试着列举几种使用统计图表时那些可能让人抓狂的瞬间,欢迎各位对号入座:


board.png


看似简单的统计图表用起来却不简单,背后的原因错综复杂。在图表以折、柱、饼的形态最终呈现给用户之前,经过了一条长长的图表加工流水线,涵盖从设计体系到工程实现,从图形渲染、可视化语法到最后的图表封装等各种流程,任何一个流程的质量都会直接影响图表的体验。

为了服务好统计图表的用户,AntV 精心打磨了一套完整的工厂流水线,涵盖从原材料、加工到组装成品的所有工序,已经全部在 GitHub 上开源并持续迭代。工厂的结构并不复杂,大家可以按照路标去找自己想要的东西:


pipeline.png




原材料车间 — G 4.0

渲染层产出图表的原材料:图形、绘制、动画、事件


G 是一款易用、高效、强大的 2D 可视化渲染引擎,提供 Canvas、SVG 等多种渲染方式的实现。本次 G 4.0 在兼容 3.0 版本接口的同时,增加了不少的新特性,包括:  多平台支持、多种渲染模式支持、事件完善、动画增强等。


多平台支持:canvas & svg 任意切换

G 4.0 同时提供了基于 Canvas 和 SVG 两种渲染技术的实现:


深耕性能提升:多种渲染模式的探索

G 是 AntV 技术体系的基石,支撑着 G2、G6、G2Plot 等 AntV 上层产品,作为一款专注于数据可视化领域的渲染引擎,G 在提升渲染性能、应对大数据量图形的渲染、更新和拾取领域做了很多探索和沉淀。



新的渲染模式能够极大提升渲染和交互的性能,优化后的效果如下:

100,000 个图元的渲染和拾取

G 3.0

G 4.0

G-3.0.gif

G-4.0.gif

响应缓慢,交互卡顿

响应迅速,交互流畅



动画写起来更方便



加工车间 — G2 4.0 Alpha

图形语法提供了可视化结构层,将原材料加工成零件


作为图形语法(the Grammar of Graphics)的前端实现,G2 已经经历多个版本的迭代。本次 G2 4.0 是一个新的起点,我们对底层架构做了大量的重构工作,G2 会更加关注于:


我们希望 G2 4.0 会成为一个专业的、给用户带来更多可能性的可视化底层引擎,在满足传统型统计图表需求的基础上,能够更好地赋能于(但不限于):


G2 4.0 特性概览


G2 4.0 还正在进行不断的打磨工作,为了能让大家先体验,我们在此次 AntV 品牌日发布 4.0 alpha 版本。长路漫漫,我们仍有很多工作要做,有很多细节要打磨,也非常期待您的加入,一起见证 G2 的成长!


G2 4.0 Roadmap

roadmap.png



组装车间  —  ✨G2Plot

图表库将可视化零件组装为成品 — 开箱即用的统计图表


AntV 的新成员: G2Plot

虽然G2提供的可视化零件,可以创造无限可能性的图表,但是通过我们对用户反馈的跟踪,发现可视化框架和通用图表库之间在学习和使用成本上仍然存在很大的差距,无法做到简单、快速的制作。同样的零件,组装出来的图表有好看,也有不好看的。这是为什么呢?这是数据的问题抑或是?


不管怎样,无论是数据问题还是图表加工师的技能问题,我们都将一一解决。今年,我们将补上这缺失的一环,推出开箱即用、易用、好用的 G2Plot — AntV技术栈通用图表库。


想要更自信地将自己的数据更好地可视化展现出来吗?那就来看看AntV图表工厂的新成员 G2Plot 可以给我们带来什么吧。


G2Plot的定位是开箱即用、易于配置、具有良好视觉和交互体验的通用图表库。我们想做的事有三件:(1)使用户不用成为可视化专家也能够轻松制作出优雅美观的图表  (2)保证图表能够经受得起业务的检验,在真实的场景中易用、好用  (3)探索统计图表的更多可能性,使统计图表变得更好玩、更酷。


G2Plot的特性


AntDesign的成功告诉我们,好用的前端组件离不开强大的设计体系的支持,在可视化领域更是如此,G2Plot呈现给用户的是一套提炼自企业级产品的视觉语言和设计规范。不仅对图表的整体视觉样式进行了优化,并且针对每一个图表自身的特点,沉淀出一套最佳配置,保证用户能够通过最少的配置制作出优雅、标准的图表。


屏幕快照 2019-11-19 下午8.07.36.png

(短短几行代码生成优雅图表)


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

before-after.png

在 G2Plot 体系下,图表不仅仅只是各不相关的实例,图层概念的引入提供了多图表组合、叠加、联动,共同讲述一个数据故事的可能性。未来,我们还将探索统计图表转化信息图的可能性,丰富统计图表的表现能力。


  图表联动.gif



结语

我们会持续在统计图表这个领域深耕细作,不管你是哪一个阶段的用户,我们都希望AntV统计图表技术栈能够为你的业务和想象赋能。

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


AntV 品牌日的发布详情


AntV 项目链接

欢迎关注我们的 GitHub 项目,点亮 star 了解我们的实时动态,期待 pr: