方案一：转载来源：https://blog.csdn.net/zSY_snake/article/details/105412370

坐标轴名称位置调整使用nameTextStyle.padding

例如：

其它：

旋转： nameRotate, 旋转度数名称与坐标轴间距: nameGap , 间距大体位置调整：nameLocation, end、start、center三种选项

 详细文档：https://echarts.apache.org/zh/option.html#yAxis.nameTextStyle

x轴也有nameTextStyle属性。

https://echarts.apache.org/zh/option.html#xAxis.nameTextStyle

方案二：转载来源：https://blog.csdn.net/qq8241994/article/details/90720657今天在项目的开发中遇到的一个问题，echarts Y轴左侧的文字太多了，显示不全，由于这个问题网上的解决办法相对较少，所以记录一下。

先说一下网上的版本：

1.调整grid下的left属性，说白了就是调整y轴与左侧的距离，大了就能显示更多的文字

grid:{ top:48, left:400,// 调整这个属性 right:50, bottom:50,}这个的缺陷很明显，文字太多还是不管事 ，而且看起来很别扭

2.通过设置axisLabel下的formatter属性，实现自定义处理文字，将多出来的用省略号替代

yAxis:{ axisLabel:{ show:true, formatter:function(value){ var texts=value; if(texts.length>15){ // 具体多少字就看自己了 texts=texts.substr(0,15)+'...'; } return texts; } }}这个是比较合适的方法，将过长的文字用省略号替代了，鼠标放到图形上往往可以通过设置tooltip看到全称。

但是也有一个缺陷，当这个对应的图形不存在，就是没有数据的时候，你是不知道它的全称的

3.这个就是针对上面所说的缺陷所进行的处理，增加鼠标放置到y轴上显示悬浮框显示全称

// 项目是用vue写的that.chart.on('mouseover',function(e){ const component=e.componentType; const value=e.value; const offsetX=e.event.offsetX; const offsetY=e.event.offsetY; if(component==='yAxis'){ $('#图表的容器id').find('.echarts_tip').remove(); $('#图表的容器id').append(` ${value} `) } })

that.chart.on('mouseout',function(e){ const component=e.componentType; if(conponent==='yAxis'){ $('#图表的容器id').find('.echarts_tip').remove(); }})css代码：

.echarts_tip{ position:absolute; border-radius:5px; background:rgba(0,0,0,.5); color:#FFF; padding:10px 20px;}其实就是通过监听echarts的鼠标事件，然后在进行对应的处理。对于大多数的项目来说这个可能是有点多此一举了，因为大部分的图表都会有对应的数据的，只需要设置tooltip就可以了。只是我的项目中遇到了这样的问题（对应的时间段内没有数据），记录一下，希望能够帮到别人吧。

其它相似问题：

Y轴刻度标签显示不全https://blog.csdn.net/dandelion_drq/article/details/79270597

Y轴刻度标签名称替换

https://www.cnblogs.com/conserdao/p/6911048.html