yAxis: {
show: true, //是否显示
position: 'left', //y轴的位置(left/right)
offset: 0, //y轴相对于默认位置的偏移,在相同的 position 上有多个 X 轴的时候有用
type: 'value', //坐标轴类型 (value/category/time/log)
name: '单位/个', //坐标轴名称
nameLocation: 'end', //坐标轴名称显示位置(start/center/end)
//坐标轴名称的文字样式
nameTextStyle: {
align: 'center', // 文字水平对齐方式,默认自动('left','center','right')
verticalAlign: 'bottom', // 文字垂直对齐方式,默认自动('top','middle','bottom')
lineHeight: '15', // 行高
// backgroundColor: 'red',
color: 'green', //字体颜色
fontSize: 10, //字体大小
fontWeight: 'normal', //字体粗细 (bold/bolder/lighter/normal)
fontstyle: 'normal', //文字样式(normal/italic/oblique)
fontFamily: '楷体', //文字风格(楷体/宋体/华文行楷等等)
padding: [5, 10, 2, -5] //文字边距(上右下左)
},
nameGap: 15, //坐标轴名称与轴线之间的距离
nameRotate: 0, //坐标轴名字旋转的角度值
inverse: false, //是否为反向坐标轴
// 坐标轴轴线
axisLine: {
show: true, // 是否显示
lineStyle: {
color: 'green', //坐标轴颜色
width: 2, // 坐标轴线线宽
type: 'solid', // 坐标轴线线的类型('solid'实线;'dashed'虚线;'dotted'点状)
opacity: 0.5 //线的透明度(用0~1的小数表示)
},
symbol: ['none', 'arrow'], // 轴线两端箭头,两个值(左、右),none表示没有箭头,arrow表示有箭头
symbolSize: [8, 15] // 轴线两端箭头大小,数值一表示高度,数值二表示宽度
},
// 刻度线
axisTick: {
show: true, // 是否显示
inside: false, // 坐标轴刻度是否朝内,默认朝外(false)
length: 5, // 坐标轴刻度的长度
alignWithLabel: true, //刻度线与刻度标签是否对齐
lineStyle: {
color: '#333', //刻度线颜色
width: 2, // 刻度线粗细
type: 'dashed' // 坐标轴线线的类型('solid'实线;'dashed'虚线;'dotted'点状)
}
},
// 坐标轴刻度标签(轴文字)
axisLabel: {
show: true,
interval: 1, // 显示间隔,在类目轴中有效,0显示所有
inside: false, // 是否朝内,默认朝外(false)
rotate: 0, // 旋转角度,旋转的角度从 -90 度到 90 度
margin: 8, // 刻度标签与轴线之间的距离
color: '#ccc', // 刻度标签文字的颜色
fontStyle: 'normal', // 文字字体的风格('normal'无样式;'italic'斜体;'oblique'倾斜字体)
fontWeight: 'normal', // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
fontSize: '12' // 文字字体大小
// align: 'center', // 文字水平对齐方式,默认自动('left','center','right')
// lineHeight: '12', // 行高
// formatter 刻度标签的内容格式器,支持字符串模板和回调函数两种形式
// verticalAlign: 'top', // 文字垂直对齐方式,默认自动('top','middle','bottom'
// backgroundColor: 'red' // 文字块背景色,例:'#123234', 'red', 'rgba(0,23,11,0.3)'
},
// 网格线
splitLine: {
show: true, // 是否显示分隔线(默认数值轴显示,类目轴不显示)
interval: 0, // 坐标轴刻度标签的显示间隔,在类目轴中有效,0显示所有
// 分隔线颜色,可以设置成单个颜色,也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色
color: ['#aaa'],
width: 1, // 分隔线线宽
type: 'solid' // 坐标轴线线的类型('solid'实线;'dashed'虚线;'dotted'点状)
},
// 分隔区域
splitArea: {
show: false, // 是否显示分隔区域
interval: 0, // 坐标轴刻度标签的显示间隔,在类目轴中有效,0显示所有
areaStyle: {
color: ['rgba(250,250,250,0.3)', 'rgba(200,200,200,0.3)'], // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色
opacity: 0.5 // 图形透明度(0-1)
}
}
},
ECharts的基本配置-Y轴配置(yAxis)
最新推荐文章于 2025-03-17 08:48:19 发布