Echarts之yAxis属性超超超级详情版学习
yAxis | 属性 | 说明 | 类型 |
id | 组件id | string | |
show | 是否显示y轴 | boolean | |
alignTicks | 在多个 y 轴为数值轴的时候,可以开启该配置项自动对齐刻度。只对'value' 和'log' 类型的轴有效 | boolean | |
position | y 轴的位置 | string | |
offset | Y 轴相对于默认位置的偏移,在相同的 position 上有多个 Y 轴的时候有用。注:若未将 yAxis.axisLine.onZero 设为 false , 则该项无法生效 | number | |
type | 坐标轴类型 | string | |
nameLocation | 坐标轴名称显示位置 | string | |
nameTextStyle | 坐标轴名称的文字样式. yAxis.nameTextStyle.fontWeight:坐标轴名称文字字体的粗细。 yAxis.nameTextStyle.align:文字水平对齐方式 yAxis.nameTextStyle.textBorderColor:文字本身的描边颜色 yAxis.nameTextStyle.textShadowColor:文字本身的阴影颜色 yAxis.nameTextStyle.textShadowBlur:文字本身的阴影长度 yAxis.nameTextStyle.textShadowOffsetX:文字本身的阴影 X 偏移 yAxis.nameTextStyle.textShadowOffsetY:文字本身的阴影 Y 偏移 yAxis.nameTextStyle.ellipsis:在 yAxis.nameTextStyle.rich:可以自定义富文本样式 | - | |
nameGap | 坐标轴名称与轴线之间的距离 | ||
nameRotate | 坐标轴名字旋转,角度值 | ||
nameTruncate | 坐标轴名字的截断 yAxis.nameTruncate.maxWidth:截断文本的最大长度,超过此长度会被截断 yAxis.nameTruncate.ellipsis:截断后文字末尾显示的内容 | ||
inverse | 是否是反向坐标轴 | ||
boundaryGap | 坐标轴两边留白策略 | boolean Array | |
min | 坐标轴刻度最小值 | number string Function | |
max | 坐标轴刻度最大值 | number string Function | |
scale | 是否是脱离 0 值比例 | boolean | |
splitNumber | 坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,最后实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整 | number | |
minInterval | 自动计算的坐标轴最小间隔大小 | number | |
maxInterval | 自动计算的坐标轴最大间隔大小 | number | |
interval | 强制设置坐标轴分割间隔 | number | |
logBase | 对数轴的底数,只在对数轴中(type: 'log')有效 | number | |
startValue | 用于指定轴的起始值 | number | |
silent | 坐标轴是否是静态无法交互 | boolean | |
triggerEvent | 坐标轴的标签是否响应和触发鼠标事件,默认不响应 | boolean | |
axisLine | 坐标轴轴线相关设置 yAxis.axisLine.symbol:轴线两边的箭头 yAxis.axisLine.symbolSize:轴线两边的箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向) yAxis.axisLine.symbolOffset:轴线两边的箭头的偏移,如果是数组,第一个数字表示起始箭头的偏移,第二个数字表示末端箭头的偏移;如果是数字,表示这两个箭头使用同样的偏移。 yAxis.axisLine.lineStyle:坐标轴样式 yAxis.axisLine.lineStyle.color:坐标轴线线的颜色 yAxis.axisLine.lineStyle.width:坐标轴线线宽 yAxis.axisLine.lineStyle.type:线的类型 yAxis.axisLine.lineStyle.dashOffset:用于设置虚线的偏移量 yAxis.axisLine.lineStyle.cap:用于指定线段末端的绘制方式 yAxis.axisLine.lineStyle.join:用于设置2个长度不为0的相连部分(线段,圆弧,曲线)如何连接在一起的属性(长度为0的变形部分,其指定的末端和控制点在同一位置,会被忽略) yAxis.axisLine.lineStyle.miterLimit:用于设置斜接面限制比例 yAxis.axisLine.lineStyle.shadowBlur:图形阴影的模糊大小 yAxis.axisLine.lineStyle.shadowColor:阴影颜色 yAxis.axisLine.lineStyle.shadowOffsetX:阴影水平方向上的偏移距离。 yAxis.axisLine.lineStyle.shadowOffsetY:阴影垂直方向上的偏移距离 yAxis.axisLine.lineStyle.opacity:图形透明度。支持从 0 到 1 的数字,为 0 时不绘制该图形 | - | |
axisTick | 坐标轴刻度相关设置 yAxis.axisTick.alignWithLabel:类目轴中在 yAxis.axisTick.interval:坐标轴刻度的显示间隔,在类目轴中有效 yAxis.axisTick.inside:坐标轴刻度是否朝内,默认朝外 yAxis.axisTick.length:坐标轴刻度的长度 yAxis.axisTick.lineStyle:刻度线的样式设置 yAxis.axisTick.lineStyle.color:刻度线的颜色 yAxis.axisTick.lineStyle.width:坐标轴刻度线宽 yAxis.axisTick.lineStyle.type:线的类型 yAxis.axisTick.lineStyle.dashOffset:用于设置虚线的偏移量 yAxis.axisTick.lineStyle.cap:用于指定线段末端的绘制方式 yAxis.axisTick.lineStyle.join:用于设置2个长度不为0的相连部分(线段,圆弧,曲线)如何连接在一起的属性(长度为0的变形部分,其指定的末端和控制点在同一位置,会被忽略) yAxis.axisTick.lineStyle.miterLimit:用于设置斜接面限制比例 yAxis.axisTick.lineStyle.shadowBlur:图形阴影的模糊大小 yAxis.axisTick.lineStyle.shadowColor:阴影颜色 yAxis.axisTick.lineStyle.shadowOffsetX:阴影水平方向上的偏移距离 yAxis.axisTick.lineStyle.shadowOffsetY:阴影垂直方向上的偏移距离 yAxis.axisTick.lineStyle.opacity:图形透明度 yAxis.axisTick.customValues:自定义要显示的坐标轴刻度位置 yAxis.axisTick.minorTick:坐标轴次刻度线相关设置 yAxis.axisTick.minorTick.show:是否显示次刻度线 yAxis.axisTick.minorTick.splitNumber:次刻度线分割数 yAxis.axisTick.minorTick.length:次刻度线的长度 yAxis.axisTick.minorTick.lineStyle.color:刻度线的颜色 yAxis.axisTick.minorTick.lineStyle.width:次刻度线线宽 yAxis.axisTick.minorTick.type:线的类型 yAxis.axisTick.minorTick.dashOffset:用于设置虚线的偏移量 yAxis.axisTick.minorTick.cap:用于指定线段末端的绘制方式 yAxis.axisTick.minorTick.join:用于设置2个长度不为0的相连部分(线段,圆弧,曲线)如何连接在一起的属性(长度为0的变形部分,其指定的末端和控制点在同一位置,会被忽略) yAxis.axisTick.minorTick.miterLimit:用于设置斜接面限制比例 yAxis.axisTick.minorTick.shadowBlur:图形阴影的模糊大小 yAxis.axisTick.minorTick.shadowColor:阴影颜色 yAxis.axisTick.minorTick.shadowOffsetX:阴影水平方向上的偏移距离 yAxis.axisTick.minorTick.shadowOffsetY:阴影垂直方向上的偏移距离 yAxis.axisTick.minorTick.opacity:图形透明度 yAxis.axisTick.axisLabel:坐标轴刻度标签的相关设置 yAxis.axisTick.axisLabel.show:是否显示刻度标签 yAxis.axisTick.axisLabel.interval:坐标轴刻度标签的显示间隔,在类目轴中有效 yAxis.axisTick.axisLabel.inside:刻度标签是否朝内,默认朝外 yAxis.axisTick.axisLabel.rotate:刻度标签旋转的角度,在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠 yAxis.axisTick.axisLabel.margin:刻度标签与轴线之间的距离 yAxis.axisTick.axisLabel.formatter:刻度标签的内容格式器,支持字符串模板和回调函数两种形式 yAxis.axisTick.axisLabel.showMinLabel:是否显示最小 tick 的 label yAxis.axisTick.axisLabel.showMaxLabel:是否显示最大 tick 的 label yAxis.axisTick.axisLabel.verticalAlignMinLabel:最小的坐标刻度标签的对齐方式 yAxis.axisTick.axisLabel.vercalAlignMaxLabel:最大的坐标刻度标签的对齐方式 yAxis.axisTick.axisLabel.hideOverlap:是否隐藏重叠的标签 yAxis.axisTick.axisLabel.customValues:自定义要显示的标签位置 yAxis.axisTick.axisLabel.color:刻度标签文字的颜色 yAxis.axisTick.axisLabel.fontStyle:文字字体的风格 yAxis.axisTick.axisLabel.fontWeight:文字字体的粗细 yAxis.axisTick.axisLabel.fontFamily:文字的字体系列 yAxis.axisTick.axisLabel.fontSize:文字的字体大小 yAxis.axisTick.axisLabel.align:文字水平对齐方式,默认自动 yAxis.axisTick.axisLabel.verticalAlign:文字垂直对齐方式 yAxis.axisTick.axisLabel.lineHeight:行高 yAxis.axisTick.axisLabel.backgroundColor:文字块背景色 yAxis.axisTick.axisLabel.borderColor:文字块边框颜色 yAxis.axisTick.axisLabel.borderWidth:文字块边框宽度 yAxis.axisTick.axisLabel.borderType:文字块边框描边类型 yAxis.axisTick.axisLabel.borderDashOffset:用于设置虚线的偏移量 yAxis.axisTick.axisLabel.borderRadius:文字块的圆角 yAxis.axisTick.axisLabel.padding:文字块的内边距 yAxis.axisTick.axisLabel.shadowColor:文字块的背景阴影颜色 yAxis.axisTick.axisLabel.shadowBlur:文字块的背景阴影长度 yAxis.axisTick.axisLabel.shadowOffsetX:文字块的背景阴影 X 偏移 yAxis.axisTick.axisLabel.shadowOffsetY:文字块的背景阴影 Y 偏移 yAxis.axisTick.axisLabel.width:文本显示宽度 yAxis.axisTick.axisLabel.height:文本显示高度 yAxis.axisTick.axisLabel.textBorderColor:文字本身的描边颜色 yAxis.axisTick.axisLabel.textBorderWidth:文字本身的描边宽度 yAxis.axisTick.axisLabel.textBorderType:文字本身的描边类型 yAxis.axisTick.axisLabel.textBorderDashOffset:用于设置虚线的偏移量 yAxis.axisTick.axisLabel.textShadowColor:文字本身的阴影颜色 yAxis.axisTick.axisLabel.textShadowOffsetX:文字本身的阴影 X 偏移 yAxis.axisTick.axisLabel.textShadowOffsetY:文字本身的阴影 Y 偏移 yAxis.axisTick.axisLabel.overflow:文字超出宽度是否截断或者换行 yAxis.axisTick.axisLabel.ellipsis:在 yAxis.axisTick.axisLabel.rich:可以自定义富文本样式 | - | |
splitLine | 坐标轴在 grid 区域中的分隔线 yAxis.splitLine.lineStyle:分割线线段样式 | - | |
minorSplitLine | 坐标轴在 grid区域中的次分隔线。次分割线会对齐次刻度线 minorTick yAxis.minorSplitLine.show:是否显示次分隔线 yAxis.minorSplitLine.lineStyle:此分割线线段样式 | ||
splitArea | 坐标轴在 grid 区域中的区域,默认不显示 yAxis.splitArea.interval:是否显示次分隔区域的显示间隔 yAxis.splitArea.show:是否显示次分隔区域 yAxis.splitArea.lineStyle:此分割区域的样式 | ||
data | 类目数据 | ||
axisPointer | 坐标轴指示器配置项 yAxis.axisPointer.label:坐标轴指示器的文本标签 yAxis.axisPointer.lineStyle:坐标轴指示器样式 yAxis.axisPointer.shadowStyle:坐标轴指示器阴影样式 yAxis.axisPointer.triggerEmphasis:坐标轴指示器是否触发系列强调功能 yAxis.axisPointer.triggerTooltip:坐标轴指示器是否触发 tooltip,如果不想触发 tooltip 可以关掉。 yAxis.axisPointer.value:坐标轴指示器当前的 value yAxis.axisPointer.status:坐标轴指示器当前的状态 yAxis.axisPointer.handel:坐标轴指示器拖拽手柄,适用于触屏的环境 | - | |
animation | 是否开启动画 | boolean | |
animationThreshold | 是否开启动画的阈值,当单个系列显示的图形数量大于这个阈值时会关闭动画 | number | |
animationDuration | 初始动画的时长,支持回调函数,可以通过每个数据返回不同的时长实现更戏剧的初始动画效果 | number | |
animationEasing | 初始动画的缓动效果 | string | |
animationDelay | 初始动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果 | number Function | |
animationDelayUpdate | 数据更新动画的延迟,支持回调函数,可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果 | ||
animationDurationUpdate | 数据更新动画的时长 | number Function | |
zlevel | Y 轴所有图形的 zlevel 值 | ||
z | Y 轴组件的所有图形的z 值。控制图形的前后顺序。z 值小的图形会被z 值大的图形覆盖 |