1、标题

ECharts在显示区域太小或数据内容过多的时候,柱状图横坐标内容显示不全,如下图所示:

2、解决

2.1在横坐标中添加interval: 0
xAxis: [
      {
        axisLabel: {
          interval: 0, // 可以设置成0强制显示所有标签
        }
      }
    ],

横坐标现实全了但会重叠,如下图所示:

2.2 所以可以让文字倾斜以显示全,代码如下:
axisLabel: {
          interval: 0, // 坐标轴刻度标签的显示间隔,在类目轴中有效;默认会采用标签不重叠的策略间隔显示标签;可以设置成0强制显示所有标签;
            rotate: -50, // 刻度标签旋转的角度,在类目轴的类目标签显示不下的时候可以通过旋转防止标签之间重叠;旋转的角度从-90度到90度
            inside: false, // 刻度标签是否朝内,默认朝外
            margin: 6, // 刻度标签与轴线之间的距离
        }

效果图如下:

Logo

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。

更多推荐