阿里、蚂蚁、晟腾、中科加禾精彩分享 AI 基础设施洞见,现购票可享受 9 折优惠 |AICon 了解详情
写点什么

Apache ECharts 正式毕业,成为 ASF 顶级项目

  • 2021-01-27
  • 本文字数:1772 字

    阅读完需:约 6 分钟

Apache ECharts 正式毕业,成为 ASF 顶级项目

1 月 26 日,Apache 基金会官方宣布 ECharts 项目正式毕业,成为 Apache 顶级项目。


Apache ECharts 是由百度团队开源,并于 2018 年捐赠给 Apache 基金会。这是一款基于 JavaScript 的数据可视化图标库,可以生产直观、可交互、定制化的数据可视化图表。


据悉,在从 Apache 基金会毕业的同时,ECharts 将会发布大版本 ECharts 5。上一个版本 ECharts 4 发布于 2018 年初,当时有些常用图表已经可以支持最高达千万级的数据可视化,支持直接传入包括二维表,key-value 等多种格式的数据源,支持小程序、无障碍访问等,支持以 Canvas、SVG(4.0+)、VML 的形式渲染图表,可跨平台使用。


Apache ECharts 5 将于 2021.01.28 20:00 进行线上发布会。本次新版本将会带来五大模块、十五项新特性的全面升级。

动态叙事


之前版本中,Apache ECharts 是通过初始化动画和过渡动画帮助用户理解数据变换之间的联系。5.0 版本中,Apache ECharts 大幅度增强了动画叙事能力,借助图表的动态叙事功能,帮助用户理解图表背后表达的故事。


  • 动态排序图:Apache ECharts 5 新增支持动态排序柱状图(bar-racing)以及动态排序折线图(line-racing),开发者可以方便地创建带有时序性的图表,展现数据随在时间维度上的变化;

  • 自定义系列动画:Apache ECharts 5 在自定义系列中提供了更加丰富强大的动画效果,支持标签数值文本的插值动画,图形的形变(morph)、分裂(separate)、合并(combine)等效果的过渡动画。

视觉设计


视觉设计不仅是为了让图表更好看,更是为了让用户快速理解图表表达的内容,消除不良设计带来的误解。


  • 默认设计:Apache ECharts 5 重新设计了默认的主题样式,针对不同的系列和组件分别做了优化调整,充分考量了颜色之间的区分度、与背景色的对比度、相邻颜色的和谐度等因素,确保色觉辨识障碍人士也能清楚地区分数据。

  • 标签:Apache ECharts 5 提供了多种新的标签功能,让密集的标签能清晰显示、准确表意,例如自动隐藏重叠标签、自动排布标签等。

  • 时间轴:Apache ECharts 5 支持表达时间标签刻度的时间轴,开发者可以根据不同的需求定制时间轴的标签内容。

  • 提示框:Apache ECharts 5 对提示框的样式进行了优化,通过对字体样式、颜色的调整、新增加箭头、跟随图形颜色的边框色等功能,使得提示框的默认展示更清晰。同时,改进了富文本的渲染逻辑,确保显示效果与 HTML 方式一致。提示框内的列表也可以按照数值大小或者类目顺序排序。

  • 仪表盘:Apache ECharts 5 对仪表盘的功能作了全面升级,支持了图片或者矢量路径绘制指针、也支持了锚点(anchor)配置项、进度条(progress)、圆角效果等等配置项。

  • 扇形圆角:Apache ECharts 5 支持了饼图、旭日图、矩形树图的扇形圆角。

交互能力


交互能力可以帮助用户更好地了解图表。


  • 状态管理:Apache ECharts 5 在原先的鼠标 hover 高亮的基础上,新增加了淡出其它非相关元素的效果,从而达到聚焦目标数据的目的。同时,为所有系列还添加了点击选中的交互功能。

  • 性能提升:Apache ECharts 5 支持脏矩形渲染,解决只有局部变化的场景下的性能瓶颈;实时时序数据的折线图性能优化,,千万级的数据也可以在 1s 内渲染完,并且保持很小的内存占用以及流畅的提示框(tooltip)等交互。

开发体验


功能强大的可视化工具也需要以更简单的方式被开发者使用。


  • 数据集:Apache ECharts 5 加强了数据集的数据转换能力,让开发者可以使用简单的方式实现常用的数据处理,并通过统一的声明式方式来使用这些功能,实现常用的数据操作。

  • 国际化:之前 ECharts 的国际化实现是根据不同的语言参数打包出不同的部署文件的形式。Apache ECharts 5 将动态的语言包和静态的代码包分离开。切换语言的时候,只需要加载相应语言包,通过类似挂载主题的方式,使用 registerLocale 函数挂载语言包对象,重新初始化后就完成了语言的切换。

  • TypeScript 重构:Apache ECharts 5 的开发之初就使用 TypeScript 对代码进行了重写,TypeScript 所带来的强类型使得新版本中实现了更多新特性。

可访问性


Apache ECharts 5 中实现了更多提高可访问性的设计,帮助视觉障碍人士更好地理解图表内容。


  • 主题配色:新版默认主题样式将无障碍设计作为一个重要的考量依据,并提供了特殊的高对比度主题,以更高对比度颜色的主题将数据作进一步区分。

  • 贴花图案:Apache ECharts 5 新增了贴花的功能,用图案辅助颜色表达,进一步帮助用户区分数据。

2021-01-27 23:143896
用户头像

发布了 497 篇内容, 共 308.6 次阅读, 收获喜欢 1907 次。

关注

评论

发布
暂无评论
发现更多内容

自主创新、领先一代,星环科技成功登陆科创板

星环科技

大数据 开源

遮罩和蒙版有什么区别,视频遮罩怎么用

懒得勤快

前端JavaScript小技巧【建议收藏】

江拥羡橙

JavaScript ES6 10月月更

spring用到的设计模式

急需上岸的小谢

10月月更

eeui安卓开发--如此简单

江拥羡橙

android Weex 安卓 10月月更

Databend 存储架构总览

Databend

途游游戏 DevOps 实践|都说「单元测试」好,「AAAC四步法」少不了

极狐GitLab

DevOps 运维 单元测试 CI/CD 代码安全

数字云栖,邀您共享极致计算与创新进化的科技盛宴

阿里云视频云

阿里云 边缘计算 云栖大会

如何进行企业数字化转型?传统企业数字化转型的3大底层逻辑

优秀

企业数字化转型

ios苹果打包——超详细的教程分享

江拥羡橙

ios CocoaPods 苹果 Weex 10月月更

一文彻底搞懂前端缓存机制

hellocoder2029

JavaScript

前端懒加载和预加载

hellocoder2029

JavaScript

秒杀活动!!!! 如何撑住10W QPS

CTO技术共享

10月月更

生产环境P0级事故,整个项目组被罚

CTO技术共享

【kafka原理】 消费者偏移量__consumer_offsets_相关解析

石臻臻的杂货铺

kafka 10月月更

企业如何添加内嵌式的帮助文档

Baklib

帮助文档

为什么vue3要选用proxy,好处是什么?

hellocoder2029

JavaScript

不可错过!14位安全大拿齐聚!AMD、Arm及Intel等技术专家解读系统安全 | 2022云栖大会

OpenAnolis小助手

开源社区 系统安全 云栖大会 龙蜥安全专场 操作系统峰会

docker学习笔记

Spring事务传播机制

急需上岸的小谢

10月月更

leetcode 450. Delete Node in a BST 删除二叉搜索树中的节点 (中等)

okokabcd

LeetCode 数据结构与算法

Go语言入门04—循环语句

良猿

Go golang 后端 10月月更

驾考宝典携手HMS Core统一扫码服务,构建复杂场景中的流畅扫码体验

HMS Core

扫码

分布式事务-CAP理论

zarmnosaj

10月月更

node+express操作cookie

木偶

前端 Node Express 10月月更

【kubernetes技术专题】Kubernetes架构分析介绍篇(入门篇)

洛神灬殇

Kubernetes k8s Kubernetes Serverless 10月月更

ERP到底是自研还是外采好????

CTO技术共享

10月月更

担时代任务 与国家同频 | 九科信息创始人万正勇:自主可控是中国超级自动化技术发展的必要条件

九科Ninetech

RPA 信创

促双碳|AIRIOT智慧能源管理解决方案

AIRIOT

物联网 智慧能源

【kafka原理】kafka Log存储解析以及索引机制

石臻臻的杂货铺

kafka 10月月更

正向代理与反向代理

急需上岸的小谢

10月月更

Apache ECharts 正式毕业,成为 ASF 顶级项目_大前端_田晓旭_InfoQ精选文章