EChartsx轴y轴（xAxis，yAxis）常⽤属性说明
代码
{
show: true,    // 是否显⽰ x 轴
position: 'top',    // x 轴的位置（'top'，'bottom'）
type: 'category',    // 坐标轴类型('category','value')
nameRotate: 10,    // 坐标轴名字旋转，⾓度值
inverse: false,    // 是否是反向坐标轴
splitNumber: 5,    // 坐标轴的分割段数（预估值）
boundaryGap:false,//坐标轴两边留⽩策略，类⽬轴和⾮类⽬轴的设置和表现不⼀样。类⽬轴中 boundaryGap 可以配置为 true 和 false。默认为 true，这时候刻度只    axisLine: {
show: true,    // 是否显⽰坐标轴轴线
symbol: ['none', 'arrow'],    // 轴线两端箭头，两个值，none表⽰没有箭头，arrow表⽰有箭头
symbolSize: [10, 15],    // 轴线两端箭头⼤⼩，数值⼀表⽰宽度，数值⼆表⽰⾼度
lineStyle: {
color: '#333',    // 坐标轴线线的颜⾊
width: '5',    // 坐标轴线线宽
type: 'solid',    // 坐标轴线线的类型（'solid'，实线类型；'dashed'，虚线类型；'dotted'，点状类型）
},
},
axisTick: {
show: true,    // 是否显⽰坐标轴刻度
inside: true,    // 坐标轴刻度是否朝内，默认朝外
length: 5,    // 坐标轴刻度的长度
lineStyle: {
color: '#FFF',    // 刻度线的颜⾊
width: 10,    // 坐标轴刻度线宽
type: 'solid',    // 坐标轴线线的类型（'solid'，实线类型；'dashed'，虚线类型；'dotted'，点状类型）
},
},
axisLabel: {
width:'100',//⽂字容器宽度
overflow:'none',// ⽂字超出宽度是否截断或者换⾏。配置width时有效'truncate' 截断，并在末尾显⽰ellipsis配置的⽂本，默认为...'break' 换⾏'breakAll' 换⾏，跟'        show: true,    // 是否显⽰刻度标签
interval: '0',    // 坐标轴刻度标签的显⽰间隔，在类⽬轴中有效.0显⽰所有
inside: true,    // 刻度标签是否朝内，默认朝外
rotate属性
rotate: 90,    // 刻度标签旋转的⾓度，在类⽬轴的类⽬标签显⽰不下的时候可以通过旋转防⽌标签之间重叠；旋转的⾓度从 -90 度到 90 度
margin: 10,    // 刻度标签与轴线之间的距离
// formatter 刻度标签的内容格式器，⽀持字符串模板和回调函数两种形式
fontWeight: 'normal',    // ⽂字字体的粗细（'normal'，⽆样式；'bold'，加粗；'bolder'，加粗的基础上再加粗；'lighter'，变细；数字定义粗细也可以，取值范围10        fontSize: '20',    // ⽂字字体⼤⼩
align: 'left',    // ⽂字⽔平对齐⽅式，默认⾃动（'left'，'center'，'right'）
verticalAlign: 'left',    // ⽂字垂直对齐⽅式（'top'，'middle'，'bottom'）
textStyle: {
fontFamily:'oswald', // ⽂字字体的风格（可使⽤⾃定义字体）
color: this. //字体颜⾊
},
lineHeight: '50',    // ⾏⾼
backgroundColor: 'red',    // ⽂字块背景⾊
},
splitLine: {
show: true,    // 是否显⽰分隔线。默认数值轴显⽰，类⽬轴不显⽰
interval: '0',    // 坐标轴刻度标签的显⽰间隔，在类⽬轴中有效.0显⽰所有
color: ['#ccc'],    // 分隔线颜⾊，可以设置成单个颜⾊，也可以设置成颜⾊数组，分隔线会按数组中颜⾊的顺序依次循环设置颜⾊
width: 3,    // 分隔线线宽
type: 'solid',    // 坐标轴线线的类型（'solid'，实线类型；'dashed'，虚线类型；'dotted'，点状类型）
},
splitArea: {
show: true,    // 是否显⽰分隔区域
interval: '0',    // 坐标轴刻度标签的显⽰间隔，在类⽬轴中有效.0显⽰所有
areaStyle: {
color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)'],    // 分隔区域颜⾊。分隔区域会按数组中颜⾊的顺序依次循环设置颜⾊。默认是⼀个深浅的间隔⾊
color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)'],    // 分隔区域颜⾊。分隔区域会按数组中颜⾊的顺序依次循环设置颜⾊。默认是⼀个深浅的间隔⾊
opacity: 1,    // 图形透明度。⽀持从 0 到 1 的数字，为 0 时不绘制该图形
},
},
data: {
textStyle: {
color: '#FFF',    // ⽂字的颜⾊
fontStyle: 'normal',//字体风格（可使⽤⾃定义字体）
fontWeight: 'normal',    // ⽂字字体的粗细（'normal'，⽆样式；'bold'，加粗；'bolder'，加粗的基础上再加粗；'lighter'，变细；数字定义粗细也可以，取值范围            fontSize: '20',    // ⽂字字体⼤⼩
align: 'left',    // ⽂字⽔平对齐⽅式（'left'，'center'，'right'）
verticalAlign: 'baseline',    // ⽂字垂直对齐⽅式（'top'，'middle'，'bottom'）
lineHeight: '50',    // ⾏⾼）
backgroundColor: 'red',    // ⽂字块背景⾊
},
},
}
官⽹链接地址：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。