蚂蚁金服可视化图形语法 G2 3.3 发布：琢·磨

更好的阅读体验，请移步语雀

G2 是蚂蚁金服数据可视化解决方案 AntV 的一个子产品，是一套数据驱动的、高交互的可视化图形语法。

通过两个多月密锣紧鼓的开发，400+次提交，G2 3.3版本今天终于和你们见面了。自上次3.2版本发布以来，咱们收到很多图表组件相关的需求和吐槽，团队的工程师们和设计师们倾力合做，为你们带来更丰富、体验更好的图表组件。同时，3.3版本为 G2 带来新的图表成员：小提琴图，并为你们带来官方精选的图表案例。

图表组件总体升级

G2 3.3版本里，咱们重构了全部图表组件，包括图例（legend）、提示信息（tooltip）、文本标签（label）、坐标轴（axis）和辅助信息（guide），梳理并简化了组件的生命流程，以此为基础为组件带来更优化的样式和交互，并扩充了更多功能。如下提到的组件升级均可以在官网 demo 里看到。

标签（label）的痛点改进和加强

针对性地对地图、散点图和 treemap 作了 label placement 相关防覆盖的处理。

文本防覆盖	强调回调函数	灵活定位

提示信息（tooltip）加强

tooltip 此前都是 HTML 版本，本次补充了 G（Canvas 和 SVG）版本，也就是支持导出的版本。另外，HTML 版本也作了进一步增强，能够更轻松地定制出更多效果。

G 版本	HTML Content
固定位置	Mini Tooltip

图例（legend）的扩展

legend 作了大量的功能扩展和样式调整，比较值得一提的是 color / size / html 和翻页 legend。

Color	Size	HTML	翻页

坐标轴（axis）的新功能

axis 组件的 label 目前增长了两个方向的 offset 支持，所以，在小型图表中，能够实现坐标轴文本内嵌了。

6个精品案例

根据业务的关联性和复用性，咱们提炼了大量的精品 demo 案例，后续会逐步开放，这一期更新了6个折线图。

致敬和探索

3.3版本里，geom 的你们庭里又多了一位成员，小提琴图（violin）。向 vega、ggplot2 两位前辈致敬，但愿 G2 实现的版本也能为统计世界里这个经典的图表带来不同的体验：连接。

另外一方面基于3.3提供的更完善的图形语法能力，这段时间咱们作了可视化 storytelling 案例《泰坦尼克号数据集可视分析》。咱们把这个案例录制成了视频：连接。

另外一个案例是此次3.3发布前咱们用 webpack-visualizer 对 G2 的打包模块进行了可视化分析，排查 Webpack 打包过程当中存在的重复、冗余的依赖库。最终咱们用 G2 实现了一个版本：连接。

特别感谢

3.3版本的迭代中，咱们很欣喜地看到，有愈来愈多开源社区的小伙伴加入到了 G2 的贡献者行列中来。感谢你们的鼎力支持，G2 很是荣幸能和你们一路同行！（如下贡献者排名不分前后）

liunan	Li Ruo Nan	赖小赖	zzzzy

更要感谢广大用户对 G2 的青睐，据不彻底统计，自 G2 17年11月22开源至今，使用 G2 的系统数字已经由1.1k+增加到目前的8.5k+，G2 在 github 上的 star 数也由0.7k+增加到目前的6.3k+。你们的信任，让咱们倍感喜悦，同时肩上也背负起沉甸甸的责任。但愿将来的日子里，咱们继续互相激励互相提携，作出更优秀的可视化产品来。

欢迎共建

G2 是一套数据驱动的、高交互的可视化图形语法。是目前 JavaScript 社区对《The Grammar of Graphics》书中理论还原度最高的实现。感兴趣的小伙伴们欢迎经过如下途径关注和联系咱们！

• GitHub https://github.com/antvis/g2
• 官网 https://antv.alipay.com/zh-cn...
• 邮件 antv@antfin.com

AntV 是蚂蚁金服全新一代数据可视化解决方案，主要子产品包括 G二、G六、F2，欢迎共建！

原文连接