官网地址 https://echarts.apache.org/zh/option.html{
title: {
text: '标题',
subtext: '二级标题', // 同样 有sublink，subtarget subtextStyle
link: 'https://www.baidu.com', // 标题超链接
target: 'blank', // blank:新窗口打开链接,self:当前窗口打开
textStyle: {
color: '#32d233'
},
padding: [0,0,10,0], // 标题内边距
z:2, // 层级，优先级比zlevel低，不会创建Canvas
left: 'auto', // 距离左侧距离，同样有right top bottom，可以是像素值，百分比，也可以是'left', 'center', 'right'，'top', 'middle', 'bottom'
borderColor: '#32d233',
borderWidth: 1,
borderRadius: 5,
},
legend: { // 图例组件
type: 'plain', // plain:普通图例,scroll:可滚动图例，数量多可用
show: true,
orient: 'vertical', // 布局朝向:horizontal,vertical
align: 'left', // 图例标记和文本的对齐:auto,left,right
textStyle: { // 文本样式
'color': '#333'
},
inactiveColor: '#ccc', // 图例关闭时的颜色。
tooltip: { // 配置项同 tooltip
show: true
},
icon: 'circle', // 图例项的 icon,可以为图片'image://http://pped.ltd/a.png'
data: [{ // 数据数组，没有指定会默认从series获取
name: '系列1',
icon: 'circle',
textStyle: { color: 'red' }
}],
backgroundColor: '#ce23ff'
},
grid: {
show: true,
left: 'auto', // 距离左侧距离，同样有right top bottom，可以是像素值，百分比，也可以是'left', 'center', 'right'，'top', 'middle', 'bottom'
width: 'auto', // grid组件的宽度 10 auto
height: 'auto', // grid组件的高度 10 auto
containLabel: false, // grid 区域是否包含坐标轴的刻度标签
backgroundColor: '#ce23ff',
borderColor: '#229911',
borderWidth: 2,
},
xAxis: {
show: true,
position: 'bottom', // 位置 top,bottom
type: 'category', // 类型 value,category,time,log
name: 'Value', // 显示名称
nameLocation: 'end', // 显示位置:start,center,end
nameTextStyle: { // 坐标轴名称的样式
color: '#22dd33'
},
nameGap: 15, // 坐标轴与text距离
nameTruncate: { // text过长省略，width为宽度不是字数
maxWidth: 66,
ellipsis: '...'
},
inverse: true, // 反向
boundaryGap: true, // 坐标轴两边留白策略
min: function (value) { // 坐标轴刻度最小值。可设置成dataMin
return value.min - 20
}
max: 1, // 坐标轴刻度最大值。可设置成dataMax
scale: false, // 是否是脱离 0 值比例，type: 'value'有效。设置max和min后无效
splitNumber: 3, // 坐标轴的分割段数
minInterval: 0, // 自动计算的坐标轴最小间隔大小。
maxInterval: 0, // 自动计算的坐标轴最大间隔大小。
interval: 1, // 强制设置坐标轴分割间隔。
startValue: 1, // 指定轴的起始值
data: this.bloodItem
},
yAxis: {
name: 'mmHg'
},
tooltip: {
trigger: 'axis'
},
dataZoom: [{
show: true,
type: "slider",
realtime: true,
height: 10,
start: 0,
end: 100
}],
series: [{
type: 'bar',
datasetId: '',
name: '',
xAxisIndex: 1,
yAxisIndex: 1,
]
}
