echarts5.0新特性

样式属性的变化

去除 default exports 的支持

 //echarts5.0之前的引入方式import echarts from 'echarts'//echarts5.0的引入方式import * as echarts from 'echarts'

新加了按需引入

 import * as echarts from 'echarts/core';import { BarChart } from 'echarts/charts';import { GridComponent } from 'echarts/components';// 注意，新的接口中默认不再包含 Canvas 渲染器，需要显示引入，如果需要使用 SVG 渲染模式则使用 SVGRendererimport { CanvasRenderer } from 'echarts/renderers';echarts.use([BarChart, GridComponent, CanvasRenderer]);

Echarts5.0 移除了内置的 geoJSON（原先在 echarts/map 文件夹下）
Echarts5.0 不再支持 IE8 浏览器
Echarts5.0之前的版本

 5.0之前版本  （itemStyle | lineStyle | areaStyle的优先级）< visualMap的优先级,5.0版本       （itemStyle | lineStyle | areaStyle的优先级）> visualMap的优先级,

图形元素 transform属性的改动：

 position: [number, number] 改为 x: number / y: number。scale: [number, number] 改为 scaleX: number / scaleY: number。origin: [number, number] 改为 originX: number / originY: number。

图形元素附带的文本（text）的声明方式被改变：

 textPosition 改为 textConfig.positiontextOffset 改为 textConfig.offsettextRotation 改为 textConfig.rotationtextDistance 改为 textConfig.distance//下面左边部分的属性在 style 和 style.rich.? 中已不推荐使用或废弃。请使用下面右边的属性：textFill => filltextStroke => stroketextFont => fonttextStrokeWidth => lineWidthtextAlign => aligntextVerticalAlign => verticalAligntextLineHeight =>textWidth => widthtextHeight => highttextBackgroundColor => backgroundColortextPadding => paddingtextBorderColor => borderColortextBorderWidth => borderWidthtextBorderRadius => borderRadiustextBoxShadowColor => shadowColortextBoxShadowBlur => shadowBlurtextBoxShadowOffsetX => shadowOffsetXtextBoxShadowOffsetY => shadowOffsetY

label属性 color、textBorderColor、backgroundColor、borderColor 中，值 auto 已不推荐使用，而推荐使用 ‘inherit’ 代替
hoverAnimation属性

 series.hoverAnimation => series.emphasis.scale

折线图（line）：

 series.clipOverflow => series.clip

饼图（pie）

 series.label.margin => series.label.edgeDistanceseries.clockWise => series.clockwiseseries.hoverOffset => series.emphasis.scaleSize

地图（map）

 series.mapType => series.map 选项 series.mapLocation 已经不推荐使用。

仪表盘（gauge）：

 series.clockWise => series.clockwise series.hoverOffset => series.emphasis.scaleSize

雷达图（radar）：

 radar.name => radar.axisNameradar.nameGap => radar.axisNameGap

新增动态排序柱状图（bar-racing）以及动态排序折线图（line-racing）
动态排序柱状图
动态排序折线图
新增自定义系列动画

包括标签数值文本的插值动画，图形的形变（morph）、分裂（separate）、合并（combine）等效果的过渡动画

提示框的样式进行了优化

通过对字体样式，颜色的调整，指向图形的箭头，跟随图形颜色的边框色等功能，让提示框的默认展示优雅又清晰

5.0之前版本的提示框样式

5.0的提示框样式

标签的样式进行了优化

可以通过一个配置项开启自动隐藏重叠的标签。对于超出显示区域的标签，可以选择自动截断或者换行，让密集的标签能清晰显

时间轴进行了优化

时间轴不再如之前般绝对平均分割，而是选取年、月、日、整点这类更有意义的点来展示，并且能同时显示不同层级的刻度。标签的 formatter 支持了时间模版（例如 {yyyy}-{MM}-{dd}），并且可以为不同时间粒度的标签指定不同的 formatter，结合已有的富文本标签，可以定制出醒目而多样的时间效果。

新加了多种仪表盘图表，如：
支持了饼图、旭日图、矩形树图的扇形圆角
新增了贴花的功能
还有最重要的一点，优化渲染速度

对海量数据下的 CPU 消耗、内存占用、初始化时间都进行了深度的优化，使得百万量级的数据也能做到实时的更新（每次更新耗时少于 30ms），甚至对于千万级的数据，也可以在 1s 内渲染完，并且保持很小的内存占用以及流畅的提示框（tooltip）等交互

暂时就这么多，后面如果在发现有改动的地方会及时补充！！！

echarts5.0新特性相关推荐

JDK5.0新特性系列---目录
JDK5.0新特性系列---目录 JDK5.0新特性系列---1.自动装箱和拆箱 JDK5.0新特性系列---2.新的for循环 JDK5.0新特性系列---3.枚举类型 JDK5.0新特性系列--- ...
[转]C# 2.0新特性与C# 3.5新特性
C# 2.0新特性与C# 3.5新特性一.C# 2.0 新特性: 1.泛型List<MyObject> obj_list=new List(); obj_list.Add(new MyO ...
Servlet 3.0 新特性概述
Servlet 3.0 新特性概述 Servlet 3.0 作为 Java EE 6 规范体系中一员,随着 Java EE 6 规范一起发布.该版本在前一版本(Servlet 2.5)的基础上提供了若 ...
Redis 6.0 新特性-多线程连环13问！
来自:码大叔导读:支持多线程的Redis6.0版本于2020-05-02终于发布了,为什么Redis忽然要支持多线程?如何开启多线程?开启后性能提升效果如何?线程数量该如何设置?开启多线程后会不会有 ...
WCF4.0新特性体验(3):标准终结点（Standard Endpoints）
今天在WCF4.0新特性体验第3节,我们介绍WCF4.0里的标准终结点概念,也就是Standard Endpoints. WCF4.0提供了那些标准终结点?他们有什么作用?如何使用标准终结点?如何该表 ...
Servlet 2.0 Servlet 3.0 新特性
概念:透传. Callback 在异步线程中是如何使用的.?? Servlet 2.0 && Servlet 3.0 新特性 Servlet 2.0 && Servle ...
C#6.0，C#7.0新特性
C#6.0,C#7.0新特性 C#6.0新特性 Auto-Property enhancements(自动属性增强) Read-only auto-properties (真正的只读属性) Auto- ...
WCF4.0新特性体验(6):路由服务Routing Service（下）
紧接前文WCF4.0新特性体验(5):路由服务Routing Service(上).今天我们介绍WCF4.0消息路由的实现机制,然后会讲解路由服务的实现过程. [4]WCF与路由服务: 其实在介绍WC ...
【收藏】C# 2.03.0新特性总结
c#2.0新特性范型我们知道通用的数据结构可以采用object存储任何数据类型.使用object问题是: 显示的强制转带来的代码复杂性换装箱拆箱的性能损失(为什么有性能损失?因为涉及动态内存分配 ...

echarts5.0新特性

样式属性的变化

echarts5.0新特性相关推荐

最新文章

热门文章