导图社区 Echarts 3
- 938
- 1
- 0
- 举报
Echarts 3
Echarts 3思维导图，包括：title: ...}，标题组件；legend:...}，图例组件；grid: ...})，直角坐标系内绘图网格；xAxis:..})，直角坐标系grid 中的x轴；yAxis: ...}，直角坐标系grid中的y轴。
编辑于2022-06-25 23:00:55- Echarts 3
- 配置项.set…
- title: {...} …
- legend:{...…
- 直角坐标…
- 相似推荐
- 大纲
Echarts 3
配置项.setOption({...})
title: {...} ，标题组件
show: false，是否显示标题组件
text: ''，主标题文本
link: ''，主标题文本超链接
target: 'blank'，指定窗口打开主标题超链接
textStyle: {...}，主标题文字的颜色
color: '#333'，主标题文字的颜色
fontStyle: 'normal'，主标题文字字体的风格
fontWeight: 'normal'，主标题文字字体的粗细
fontFamily: 'sans-serif'，主标题文字的字体系列
fontSize: 18，主标题文字的字体大小
subtext: ''，副标题文本
sublink: ''，副标题文本超链接
subtarget: 'blank'，指定窗口打开副标题超链接
subtextStyle: {...}，副标题文字的颜色
color: '#aaa'，副标题文字的颜色
fontStyle: 'normal'，副标题文字字体的风格
fontWeight: 'normal'，副标题文字字体的粗细
fontFamily: 'sans-serif'，副标题文字的字体系列
fontSize: 12，副标题文字的字体大小
padding: 5，标题内边距
itemGap: 5，主副标题之间的间距
zlevel: 0，所有图形的 zlevel 值
z: 2，组件的所有图形的z值
left: 'auto'，grid 组件离容器左侧的距离
top: 'auto'，grid 组件离容器上侧的距离
right: 'auto‘；grid 组件离容器右侧的距离
bottom: 'auto'，grid 组件离容器下侧的距离。
backgroundColor: 'transparent'，标题背景色
borderColor: '#ccc、标题的边框颜色
borderWidth: 1，标题的边框线宽
shadowBlur，阴影颜色
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
legend:{...}， 图例组件
show: true，是否显示图例组件
zlevel: 0，所有图形的 zlevel 值
left: 'auto'，图例组件离容器左侧的距离
top: 'auto'，图例组件离容器上侧的距离
right: 'auto'，图例组件离容器右侧的距离
bottom: 'auto'，图例组件离容器下侧的距离
width: 'auto'，图例组件的宽度
height: 'auto'，图例组件的高度
orient: 'horizontal'，图例列表的布局朝向
align: 'auto'，图例标记和文本的对齐
padding: 5，图例内边距
itemGap: 10，图例每项之间的间隔
itemWidth: 25，图例标记的图形宽度
itemHeight: 14，图例标记的图形高度
formatter: null，图例文本的内容格式器
字符串模板
模板变量
{name}，图例名称
回调函数
selectedMode: true，图例选择的模式
selected: {...}，图例选中状态表
textStyle: {...}，图例的公用文本样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
data: [{...}]，图例的数据数组
name: ...，图例项的名称
icon: ...，图例项的 icon
textStyle: {...}，图例项的文本样式
backgroundColor: 'transparent'，图例背景色
borderColor: '#ccc'，图例的边框颜色
borderWidth: 1，图例的边框线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离。
grid: {...}， 直角坐标系内绘图网格
show: false，是否显示直角坐标系网格
zlevel: 0，所有图形的 zlevel 值
z: 2，组件的所有图形的z值
left: 'auto'，grid 组件离容器左侧的距离
top: 60，grid 组件离容器上侧的距离
right: '10%'，grid 组件离容器右侧的距离
bottom: 60，grid 组件离容器下侧的距离
width: 'auto'，grid 组件的宽度
height: 'auto'，grid 组件的高度
containLabel: false，grid 区域是否包含坐标轴的刻度标签
backgroundColor: 'transparent'，网格背景色
borderColor: '#ccc'，网格的边框颜色
borderWidth: 1，网格的边框线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
xAxis:{...}， 直角坐标系 grid 中的 x 轴
gridIndex: 0，x 轴所在的 grid 的索引
position: ...，x 轴的位置
参数
top
bottom
type: 'category'，坐标轴类型
参数
'value' 数值轴
'category' 类目轴
'time' 时间轴
'log' 对数轴
name: ...，坐标轴名称
nameLocation: 'start'，坐标轴名称显示位置
nameTextStyle: {...}，坐标轴名称的文字样式
color: '#fff'，坐标轴名称文字的颜色
fontStyle: 'normal'，坐标轴名称文字字体的风格
fontWeight: 'normal'，坐标轴名称文字字体的粗细
fontFamily: 'sans-serif’，坐标轴名称文字的字体系列
fontSize: 12，坐标轴名称文字的字体大小
nameGap: 15，坐标轴名称与轴线之间的距离
inverse: false，是否是反向坐标轴
boundaryGap: ...，坐标轴两边留白策略
min: 'auto'，坐标轴刻度最小值
max: 'auto'，坐标轴刻度最大值
scale: false，是否是脱离 0 值比例
splitNumber: 5，坐标轴的分割段数
minInterval: 0，自动计算的坐标轴最小间隔大小
interval: ...，强制设置坐标轴分割间隔
silent: true，坐标轴的标签是否响应和触发鼠标事件
axisLine: {...}，坐标轴轴线相关设置
show: true，是否显示坐标轴轴线
onZero: true，X 轴或者 Y 轴的轴线是否在另一个轴的 0 刻度上
lineStyle: {...}，线的样式
color: '#333'，坐标轴线线的颜色
width: 1，坐标轴线线宽
type: 'solid'，坐标轴线线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
axisTick: {...}，坐标轴刻度相关设置
show: true，是否显示坐标轴刻度
interval: 'auto'，坐标轴刻度的显示间隔
inside: false，坐标轴刻度是否朝内
length: 5，坐标轴刻度的长度
lineStyle: {...}，线的样式
color: '#333'，坐标轴刻度线的颜色
width: 1，坐标轴刻度线宽
type: 'solid'，坐标轴刻度线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
axisLabel: {...}，坐标轴刻度标签的相关设置
show: true，是否显示刻度标签
interval: 'auto'，坐标轴刻度标签的显示间隔
inside: false，刻度标签是否朝内
rotate: 0，刻度标签旋转的角度
margin: 8，刻度标签与轴线之间的距离
formatter: null，刻度标签的内容格式器
textStyle: {...}，文字样式
color: '#333'，刻度标签文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
splitLine: {...}，坐标轴在 grid 区域中的分隔线
show: true，是否显示分隔线
interval: 'auto'，坐标轴分隔线的显示间隔
lineStyle: {...}，线的样式
color: ['#ccc']，分隔线颜色
width: 1，分隔线线宽
type: 'solid'，分隔线线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
splitArea: {...}，坐标轴在 grid 区域中的分隔区域
interval: 'auto'，坐标轴分隔区域的显示间隔
show: true，是否显示分隔区域
areaStyle: {...}，分隔区域的样式设置
color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)'] ，分隔区域颜色
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
data: [{...}]，类目数据（type: 'category'）
value: ...，单个类目名称
textStyle: {...}，类目标签的文字样式
color: '#fff‘，文字的颜色
align: ...，文字水平对齐方式
baseline: ...，文字基线对齐方式
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
yAxis: {...}，直角坐标系 grid 中的 y 轴
gridIndex: 0，y 轴所在的 grid 的索引
position: ...，y 轴的位置
type: 'value'，坐标轴类型
'value' 数值轴
'category' 类目轴
'time' 时间轴
'log' 对数轴
name: ...，坐标轴名称
nameLocation: 'start'，坐标轴名称显示位置
参数
start
middle
end
nameTextStyle: {...}，坐标轴名称的文字样式
color: '#fff'，坐标轴名称文字的颜色
fontStyle: 'normal'，坐标轴名称文字字体的风格
fontWeight: 'normal'，坐标轴名称文字字体的粗细
fontFamily: 'sans-serif'，坐标轴名称文字的字体系列
fontSize: 12，坐标轴名称文字的字体大小
nameGap: 15，坐标轴名称与轴线之间的距离
inverse: false，是否是反向坐标轴
boundaryGap: ...，坐标轴两边留白策略
min: 'auto'，坐标轴刻度最小值
max: 'auto'，坐标轴刻度最大值
scale: false，是否是脱离 0 值比例
splitNumber: 5，坐标轴的分割段数
minInterval: 0，自动计算的坐标轴最小间隔大小
interval: ...，强制设置坐标轴分割间隔
silent: true，坐标轴的标签是否响应和触发鼠标事件
axisLine: {...}，坐标轴轴线相关设置
show: true，是否显示坐标轴轴线
onZero: true，X 轴或者 Y 轴的轴线是否在另一个轴的 0 刻度上
lineStyle: {...}，线的样式
color: '#333'，坐标轴线线的颜色
width: 1，坐标轴线线宽
type: 'solid'，坐标轴线线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
axisTick: {...}，坐标轴刻度相关设置
show: true，是否显示坐标轴刻度
interval: 'auto'，坐标轴刻度的显示间隔
inside: false，坐标轴刻度是否朝内
length: 5，坐标轴刻度的长度
lineStyle: {...}，线的样式
color: '#333'，坐标轴刻度线的颜色
width: 1，坐标轴刻度线宽
type: 'solid'，坐标轴刻度线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
axisLabel: {...}，坐标轴刻度标签的相关设置
show: true，是否显示刻度标签
interval: 'auto'，坐标轴刻度标签的显示间隔
inside: false，刻度标签是否朝内
rotate: 0，刻度标签旋转的角度
margin: 8，刻度标签与轴线之间的距离
formatter: null，刻度标签的内容格式器
textStyle: {...}，文本样式
color: '#333'，刻度标签文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
splitLine: {...}，坐标轴在 grid 区域中的分隔线
show: true，是否显示分隔线
interval: 'auto'，坐标轴分隔线的显示间隔
lineStyle: {...}，线的样式
color: ['#ccc']，分隔线颜色
width: 1，分隔线线宽
type: 'solid'，分隔线线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
子主题
splitArea: {...}，坐标轴在 grid 区域中的分隔区域
interval: 'auto'，坐标轴分隔区域的显示间隔
show: true，是否显示分隔区域
areaStyle: {...}，分隔区域的样式设置
color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']，分隔区域颜色
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
data: [{...}]，类目数据（type: 'category'）
value: ...，单个类目名称
textStyle: {...}，类目标签的文字样式
color: '#fff'，文字的颜色
align: ...，文字水平对齐方式
left
center
right
baseline: ...，文字基线对齐方式
top
middle
bottom
fontStyle: 'normal',
fontWeight: 'normal',
fontFamily: 'sans-serif',
fontSize: 12,
polar: {...}，极坐标系
radiusAxis: {...}，极坐标系的半径轴
angleAxis: {...}，极坐标系的角度轴
radar: {...}，雷达图坐标系组件
dataZoom: [...]，数据区域缩放组件
{type: 'inside', ...}，内置型数据区域缩放组件（dataZoomInside）
type: 'inside'，缩放类型
xAxisIndex: null，设置 dataZoom-inside 组件控制的 x轴
yAxisIndex: null，设置 dataZoom-inside 组件控制的 y轴
angleAxisIndex: null，设置 dataZoom-inside 组件控制的角度轴
radiusAxisIndex: null，设置 dataZoom-inside 组件控制的半径轴
filterMode: 'filter'，数据过滤模式
参数
filter 过滤掉
empty 设置为空
start: 0，数据窗口范围的起始百分比
end: 100，数据窗口范围的结束百分比
startValue: null，数据窗口范围的起始数值
endValue: null，数据窗口范围的结束数值
orient: null，布局方式是横还是竖
参数
horizontal，水平
vertical，竖直
zoomLock: false，是否锁定选择区域（或叫做数据窗口）的大小
throttle: 100，设置触发视图刷新的频率
{type: 'slider', ...}，滑动条型数据区域缩放组件（dataZoomSlider）
type: 'slider'，缩放类型
sho：true，是否显示组件
backgroundColor: 'rgba(47,69,84,0)'，组件的背景颜色
dataBackgroundColor: '#ddd'，数据阴影的背景颜色
fillerColor: 'rgba(47,69,84,0.25)',选中范围的填充颜色
handleColor: 'rgba(47,69,84,0.65)' ，控制手柄的颜色
handleSize: 10，控制手柄的尺寸
labelPrecision: 'auto'，显示label的小数精度
labelFormatter: null，显示的label的格式化器
showDetail: true，拽时候显示label详细数值信息
showDataShadow: 'auto'，是否在 dataZoom-silder 组件中显示数据阴影
realtime: true，拖动时是否实时更新系列的视图
textStyle: {...}，dataZoom 文字的样式
color: #333，dataZoom 文字的颜色
fontStyle: 'normal'，dataZoom 文字字体的风格
fontWeight: 'normal'，dataZoom 文字字体的粗细
fontFamily: 'sans-serif'，dataZoom 文字的字体系列
fontSize: 12，dataZoom 文字的字体大小
xAxisIndex: null，设置 dataZoom-slider 组件控制的 x轴
yAxisIndex: null，设置 dataZoom-slider 组件控制的 y轴
angleAxisIndex: null，设置 dataZoom-slider 组件控制的 角度轴
radiusAxisIndex: null，设置 dataZoom-slider 组件控制的 半径轴
filterMode: 'filter'，过滤模式
参数
filter ，过滤掉
empty，设置为空
start: 0，数据窗口范围的起始百分比
end: 100，数据窗口范围的结束百分比
startValue: null，数据窗口范围的起始数值
endValue: null，数据窗口范围的结束数值
orient: null，布局方式是横还是竖
参数
horizontal，水平
vertical，竖直
zoomLock: false，是否锁定选择区域（或叫做数据窗口）的大小
throttle: 100，设置触发视图刷新的频率
zlevel: 0，所有图形的 zlevel 值
z: 2，组件的所有图形的z值
left: 'auto'，dataZoom-slider组件离容器左侧的距离
top: 'auto'，dataZoom-slider组件离容器上侧的距离
right: 'auto'，dataZoom-slider组件离容器右侧的距离
bottom: 'auto'，dataZoom-slider组件离容器下侧的距离
visualMap: [...]，视觉映射组件
{type: 'continuous', ...}，连续型视觉映射组件
type: continuous，类型为连续型
min: ...，指定 visualMapContinuous 组件的最小值
max: ...，指定 visualMapContinuous 组件的最大值
range: [...]，指定手柄对应数值的位置
calculable: false，是否启用值域漫游
realtime: false，拖拽时是否实时更新
inverse: false，是否反转
precision: 0，数据展示的小数精度
itemWidth: 20，图形的宽度
itemHeight: 140，图形的高度
align: 'auto'，指定组件中手柄和文字的摆放关系
参数
auto，自动决定
left，手柄和label在右
right，手柄和label在左
top， 手柄和label在下
bottom，手柄和label在上
text: null，两端的文本
textGap: 10，两端文字主体之间的距离
show: true，是否显示 visualMap-continuous 组件
dimension: 0，指定用数据的『哪个维度』映射到视觉元素上
seriesIndex: ...，指定取哪个系列的数据
hoverLink: true，高亮显示
inRange: {...}，定义 在选中范围中 的视觉元素
outOfRange: {...}，定义 在选中范围外 的视觉元素
contoller: {...}，visualMap 组件中控制器 的 inRange outOfRange 设置
inRange: {...}，定义 在选中范围中 的视觉元素
outOfRange: {...}，定义 在选中范围外 的视觉元素
zlevel: 0，所有图形的 zlevel 值
z: 4，组件的所有图形的z值
left: 0，visualMap 组件离容器左侧的距离
top: auto，visualMap 组件离容器上侧的距离
right: auto，visualMap 组件离容器右侧的距离
bottom: 0，visualMap 组件离容器下侧的距离
orient: 'vertical'，布局方式是横还是竖
参数
horizontal，水平
vertical，垂直
padding: 5，visualMap-continuous内边距
backgroundColor: 'rgba(0,0,0,0)'，背景色
borderColor: '#ccc'，边框颜色
borderWidth: 0，边框线宽
color: ['#bf444c', '#d88273', '#f6efa6'] ，颜色配置
textStyle: {...}，文本样式
color: #333，visualMap 文字的颜色
fontStyle: 'normal'，visualMap 文字字体的风格
fontWeight: 'normal'，visualMap 文字字体的粗细
fontFamily: 'sans-serif'，visualMap 文字的字体系列
fontSize: 12，visualMap 文字的字体大小
formatter: ...，标签的格式化工具
{type: 'piecewise', ...}，分段型视觉映射组件
type: piecewise，类型为分段型
splitNumber: 5，数据分段
pieces: [...]，自定义数据段的范围、文字、样式
categories: [...]，用于表示离散型数据
min: ...，指定 visualMapPiecewise 组件的最小值
max: ...，指定 visualMapPiecewise 组件的最大值
selectedMode: 'multiple'，选择模式
参数
multiple，多选
single，单选
inverse: false，是否反转
precision: null，数据展示的小数精度
itemWidth: 20，图形的宽度
itemHeight: 14，图形的高度
align: 'auto'，指定组件中图形（比如小方块）和文字的摆放关系
参数
auto，自动决定
left，图形在左且文字在右
right，图形在右且文字在左
text: null，两端的文本
textGap: 10，两端文字主体之间的距离
itemGap: 10，每一项之间的间隔距离
itemSymbol: 'roundRect'，默认的图形
参数
circle
rect
roundRect
triangle
diamond
pin
arrow
show: true，是否显示 visualMap-piecewise 组件
dimension: 0，指定用数据的『哪个维度』映射到视觉元素上
seriesIndex: ...，指定取哪个系列的数据
hoverLink: true，高亮显示
inRange: {...}，定义 在选中范围中 的视觉元素
outOfRange: {...}，定义 在选中范围外 的视觉元素
contoller: {...}，控制器 的 inRange outOfRange 设置
inRange: {...}，定义 在选中范围中 的视觉元素
outOfRange: {...}，定义 在选中范围外 的视觉元素
zlevel: 0，所有图形的 zlevel 值
z: 4，组件的所有图形的z值
left: 0，visualMap 组件离容器左侧的距离
top: auto，visualMap 组件离容器上侧的距离
right: auto，visualMap 组件离容器右侧的距离
bottom: 0，visualMap 组件离容器下侧的距离
orient: 'vertical'，布局方式是横还是竖
参数
horizontal，水平
vertical，垂直
padding: 5，visualMap-piecewise内边距
backgroundColor: 'rgba(0,0,0,0)'，背景色
borderColor: '#ccc'，边框颜色
borderWidth: 0，边框线宽
color: ['#bf444c', '#d88273', '#f6efa6'] ，颜色样式
textStyle: {...}，文本样式
color: #333，visualMap 文字的颜色
fontStyle: 'normal'，visualMap 文字字体的风格
fontWeight: 'normal'，visualMap 文字字体的粗细
fontFamily: 'sans-serif'，visualMap 文字的字体系列
fontSize: 12，visualMap 文字的字体大小
formatter: ...，标签的格式化工具
tooltip: {...}，提示框组件
show: true，是否显示提示框组件
showContent: true，是否显示提示框浮层
trigger: 'item'，触发类型
triggerOn: 'mousemove'，提示框触发的条件
alwaysShowContent: false，是否永远显示提示框内容
showDelay: 0，浮层显示的延迟
hideDelay: 100，浮层隐藏的延迟
enterable: true，鼠标是否可进入提示框浮层中
position: ...，提示框浮层的位置
transitionDuration: 0.4，提示框浮层的移动动画过渡时间
formatter: ...，提示框浮层内容格式器
字符串模板
模板变量
{a}
{b}
{c}
{d}
{e}
回调函数
参数
params，数据集
componentType: 'series'， 成分类型
seriesType: string，系列类型
seriesIndex: number，系列在传入的 option.series 中的 index
seriesName: string，系列名称
name: string，数据名，类目名
dataIndex: number，数据在传入的 data 数组中的 index
data: Object，传入的原始数据项
value: number|Array，传入的数据值
color: string，数据图形的颜色
percent: number，饼图的百分比
dataType: undefined，数据类型
ticket，异步回调标识
callback，异步回调
backgroundColor: 'rgba(50,50,50,0.7)'，提示框浮层的背景颜色
borderWidth: 0，提示框浮层的边框宽
padding: 5，提示框浮层内边距
textStyle: {...}，提示框浮层的文本样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif，文字字体的系列
fontSize: 14，文字的字体大小
extraCssText: ...，额外附加到浮层的 css 样式
axisPointer: {...}，坐标轴指示器配置项
type: 'line'，指示器类型
axis: 'auto'，指示器的坐标轴
animation: true，是否开启动画
animationDuration: 1000，初始动画的时长
animationEasing: cubicOut，初始动画的缓动效果
animationDelay: 0，初始动画的延迟
animationDurationUpdate: 300，数据更新动画的时长
animationEasingUpdate: cubicOut，数据更新动画的缓动效果
animationDelayUpdate: 0，数据更新动画的延迟
lineStyle: {...}，线的类型
color: #555，线的颜色
width: 1，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
crossStyle: {...}，十字准星的类型
color: #555，线的颜色
width: 1，线宽
type: dashed，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
textStyle: {...}，十字准星准星上的文字样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
shadowStyle: {...}，阴影的类型
color: 'rgba(150,150,150,0.3)’，填充的颜色
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
toolbox: {...}，工具栏
show: true，是否显示工具栏组件
orient: 'horizontal'，工具栏 icon 的布局朝向
参数
horizontal
vertical
itemSize: 15，工具栏 icon 的大小
itemGap: 10，工具栏 icon 每项之间的间隔
showTitle: true，是否在鼠标 hover 的时候显示每个工具 icon 的标题
feature: {...}，工具配置项
saveAsImage: {...}，保存为图片
type: 'png'，保存的图片格式
参数
png
jpeg
name: ...，保存的文件名称
backgroundColor : 'auto'，保存的图片背景色
excludeComponents : ['toolbox'] ，保存为图片时忽略的组件列表
show: true，是否显示该工具
title: '保存为图片'，悬浮时出现的标题
icon: ...，Icon 的 path 字符串
iconStyle: {...}，保存为图片 icon 样式设置
normal: {...}，常态
color: 自适应，图形的颜色
borderColor: #666，图形的描边颜色
borderWidth: 1，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，图形的颜色
borderColor: #000，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
pixelRatio: 1，保存图片的分辨率比例
restore: {...}，配置项还原
show: true，是否显示该工具
title: '还原'，标题
icon: ...，Icon 的 path 字符串
iconStyle: {...}，还原 icon 样式设置
normal: {...}，常态
color: 自适应，图形的颜色
borderColor: #666，图形的描边颜色
borderWidth: 1，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，图形的颜色
borderColor: #000，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
dataView: {...}，数据视图工具
show: true，是否显示该工具
dataZoom: {...}，数据区域缩放
magicType: {...}，动态类型切换
子主题
子主题
子主题
子主题
子主题
geo: {...}，地理坐标系组件
parallel: {...}，平行坐标系
parallelAxis: {...}，平行坐标系中的坐标轴
timeline: {...}，多个 ECharts option 间进行切换、播放
series: [...]，系列列表
{type: 'line', ...}，折线图（数据变化趋势）
{type: 'bar', ...}，柱状图（数据大小）
type: 'bar'，类型
name: ...，系列名称
legendHoverLink: true，是否启用图例 hover时的联动高亮
coordinateSystem: 'cartesian2d'，该系列使用的坐标系
参数
cartesian2d
xAxisIndex: 0，使用的 x 轴的 index
yAxisIndex: 0，使用的 y 轴的 index
label: {...}，图形上的文本标签
normal: {...}，常态
show: false，是否显示标签
position: 'inside'，标签的位置
formatter: ...，标签内容格式器
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: ‘normal’，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
emphasis: {...}，强调
show: false，是否显示标签
position: ...，标签的位置
formatter: ...，标签内容格式器
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
itemStyle: {...}，项目样式
normal: {...}，常态
color: 自适应，柱条的颜色
barBorderColor:'#000'，柱条的描边颜色
barBorderWidth: 0，柱条的描边宽度
barBorderRadius: 0，柱形边框圆角半径
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，柱条的颜色
barBorderColor:'#000'，柱条的描边颜色
barBorderWidth: 0，柱条的描边宽度
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
stack: null，数据堆叠
barWidth: 自适应，柱条的宽度
barMaxWidth: 自适应，柱条的最大宽度
barMinHeight: 0，柱条最小高度
barGap: '30%'，柱间距离
barCategoryGap: '20%'，类目间柱形距离
data: [{...}]，系列中的数据内容数组
name: ...，数据项的名称
value: ...，单个数据项的数值
label: {...}，单个柱条文本的样式设置
normal: {...}，常态
show: false，是否显示标签
position: inside，标签的位置
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
emphasis: {...}，强调
show: false，是否显示标签
position: ...，标签的位置
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
itemStyle: {...}，项目样式
normal: {...}，常态
color: 自适应，柱条的颜色
barBorderColor:'#000'，柱条的描边颜色
barBorderWidth: 0，柱条的描边宽度
barBorderRadius: 0，柱形边框圆角半径
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，柱条的颜色
barBorderColor:'#000'，柱条的描边颜色
barBorderWidth: 0，柱条的描边宽度
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
markPoint: {...}，图表标注
symbol: 'pin'，标记的图形
参数
circle
rect
roundRect
triangle
diamond
pin
arrow
symbolSize: 50，标记的大小
symbolRotate: ...，标记的旋转角度
symbolOffset: [0, 0]，标记相对于原本位置的偏移
label: {...}，标注的文本
normal: {...}，常态
show: false，是否显示标签
position: 'inside'，标签的位置
formatter: ...，标签内容格式器
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal' ，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
emphasis: {...}，强调
show: false，是否显示标签
position: ...，标签的位置
formatter: ...，标签内容格式器
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal' ，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
itemStyle: {...}，标注的样式
normal: {...}，常态
color: 自适应，图形的颜色
borderColor: "#000" ，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，图形的颜色
borderColor: "#000" ，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
data: [{...}]，标注的数据数组
name: ''，标注名称
type: ...，特殊的标注类型
参数
min，最大值
min，最小值
average，平均值
valueIndex: ...，用于指定在哪个维度上指定最大值最小值
valueDim: ...，用于指定在哪个维度上指定最大值最小值
coord: [...]，标注的坐标
x: ...，相对容器的屏幕 x 坐标
y: ...，相对容器的屏幕 y 坐标
value: ...，标注值
symbol: ...，标记的图形
symbolSize: ...，标记的大小
symbolRotate: ...，标记的旋转角度标记的旋转角度
symbolOffset: [0, 0]，标记相对于原本位置的偏移
itemStyle: {...}，该标注的样式
normal: {...}，常态
color: 自适应，图形的颜色
borderColor: "#000" ，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
emphasis: {...}，强调
color: 自适应，图形的颜色
borderColor: "#000" ，图形的描边颜色
borderWidth: 0，描边线宽
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
label: {...}，该标注的文本
normal: {...}，常态
show: false，是否显示标签
position: ...，标签的位置
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal' ，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
emphasis: {...}，强调
show: false，是否显示标签
position: ...，标签的位置
textStyle: {...}，标签的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal' ，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
animation: true，是否开启动画
animationDuration: 1000，初始动画的时长
animationEasing: cubicOut，初始动画的缓动效果
animationDelay: 0，初始动画的延迟
animationDurationUpdate: 300，数据更新动画的时长
animationEasingUpdate: cubicOut，数据更新动画的缓动效果
animationDelayUpdate: 0，数据更新动画的延迟
markLine: {...}，图表标线
symbol: ...，标线两端的标记类型
symbolSize: ...，标线两端的标记大小
precision: 2，标线数值的精度
label: {...}，标线文本
normal: {...}，
show: true，是否显示标签
position: 'end'，标签位置
参数
start
middle
end
formatter: ...，标签内容格式器
emphasis: {...}，
show: true，是否显示标签
position: 'end'，标签位置
参数
start
middle
end
formatter: ...，标签内容格式器
lineStyle: {...}，标线样式
normal: {...}，常态
color: 自适应，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
curveness: 0，边的曲度
emphasis: {...}，强调
color: 自适应，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
data: {...}，标线的数据数组
0: {...}，起点的数据
type: ...，特殊的标注类型
参数
min，最小值
max，最大值
average，平均值
valueIndex: ...，用于指定在哪个维度上指定最大值最小值
valueDim: ...，用于指定在哪个维度上指定最大值最小值
coord: [...]，起点或终点的坐标
x: ...，相对容器的屏幕 x 坐标
y: ...，相对容器的屏幕 y 坐标
value: ...，标注值
symbol: ...，起点标记的图形
参数
circle
rect
roundRect
triangle
diamond
pin
arrow
symbolSize: ...，起点标记的大小
symbolRotate: ...，起点标记的旋转角度
symbolOffset: [0, 0]，起点标记相对于原本位置的偏移
lineStyle: {...}，该数据项线的样式
normal: {...}，常态
color: ’#000‘，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
curveness: 0，边的曲度
emphasis: {...}，强调
color: ’#000‘，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
curveness: 0，边的曲度
label: {...}，该数据项线标签的样式
normal: {...}，常态
show: true，是否显示标签
position: 'end' ，标签位置
formatter: ...，标签内容格式器
emphasis: {...}，强调
show: true，是否显示标签
position: 'end' ，标签位置
formatter: ...，标签内容格式器
1: {...}，终点的数据
type: ...，特殊的标注类型
参数
min，最小值
max，最大值
average，平均值
valueIndex: ...，用于指定在哪个维度上指定最大值最小值
valueDim: ...，用于指定在哪个维度上指定最大值最小值
coord: [...]，起点或终点的坐标
x: ...，相对容器的屏幕 x 坐标
y: ...，相对容器的屏幕 y 坐标
value: ...，标注值
symbol: ...，终点标记的图形
参数
circle
rect
roundRect
triangle
diamond
pin
arrow
symbolSize: ...，终点标记的大小
symbolRotate: ...，终点标记的旋转角度
symbolOffset: [0, 0]，终点标记相对于原本位置的偏移
lineStyle: {...}，该数据项线的样式
normal: {...}，常态
color: ’#000‘，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
curveness: 0，边的曲度
emphasis: {...}，强调
color: ’#000‘，线的颜色
width: 0，线宽
type: solid，线的类型
shadowBlur: ...，图形阴影的模糊大小
shadowColor: ...，阴影颜色
shadowOffsetX: 0，阴影水平方向上的偏移距离
shadowOffsetY: 0，阴影垂直方向上的偏移距离
opacity: ...，图形透明度
curveness: 0，边的曲度
label: {...}，该数据项线标签的样式
normal: {...}，常态
show: true，是否显示标签
position: 'end' ，标签位置
formatter: ...，标签内容格式器
emphasis: {...}，强调
show: true，是否显示标签
position: 'end' ，标签位置
formatter: ...，标签内容格式器
animation: true，是否开启动画
animationDuration: 1000，初始动画的时长
animationEasing: cubicOut，初始动画的缓动效果
animationDelay: 0，初始动画的延迟
animationDurationUpdate: 300，数据更新动画的时长
animationEasingUpdate: cubicOut，数据更新动画的缓动效果
animationDelayUpdate: 0，数据更新动画的延迟
zlevel: 0，柱状图所有图形的 zlevel 值
z: 2，柱状图组件的所有图形的z值
silent: false，图形是否响应和触发鼠标事件
animation: true，是否开启动画
animationDuration: 1000，初始动画的时长
animationEasing: cubicOut，初始动画的缓动效果
animationDelay: 0，初始动画的延迟
animationDurationUpdate: 300，数据更新动画的时长
animationEasingUpdate:cubicOut，数据更新动画的缓动效果
animationDelayUpdate: 0，数据更新动画的延迟
{type: 'pie', ...}，饼图（数据占比）
{type: 'scatter', ...}，散点图（数据的 x，y 之间的关系）
{type: 'effectScatter', ...}，特效散点图（数据视觉突出）
{type: 'radar', ...}，雷达图（多变量的数据）
{type: 'treemap', ...}，Treemap图（使用面积突出各层级的重点）
{type: 'boxplot', ...}，箱形图（数据分散情况统计）
{type: 'candlestick', ...}，K线图（数据走势）
{type: 'heatmap', ...}，热力图（颜色表现数值大小）
{type: 'map', ...}，地图（地理区域数据可视化）
{type: 'parallel', ...}，平行坐标系的系列（可视化高维数据）
{type: 'lines', ...}，线图（路线的可视化）
{type: 'graph', ...}，关系图（节点以及节点之间的关系数据）
{type: 'sankey', ...}，桑基图（物质转换的流图）
{type: 'funnel', ...}，漏斗图
{type: 'gauge', ...}，仪表盘
color: [...]，调色盘颜色列表
backgroundColor: ...，背景色
textStyle: {...}，全局的字体样式
color: '#fff'，文字的颜色
fontStyle: 'normal'，文字字体的风格
fontWeight: 'normal'，文字字体的粗细
fontFamily: 'sans-serif'，文字的字体系列
fontSize: 12，文字的字体大小
animation: true，是否开启动画，默认开启
animationDuration: 1000，初始动画的时长
animationEasing: cubicOut，初始动画的缓动效果
animationDelay: 0，初始动画的延迟
animationDurationUpdate: 300，数据更新动画的时长
animationEasingUpdate: cubicOu，数据更新动画的缓动效果
animationDelayUpdate: 0，数据更新动画的延迟