美文网首页
echarts:折线图横坐标内容过长省略显示

echarts:折线图横坐标内容过长省略显示

作者: 猪儿打滚 | 来源:发表于2020-12-15 08:56 被阅读0次

    背景

    在画echarts图时,可能会出现X轴或Y轴的标题过长的显示问题

    解决

    PS.这里是折线图的X轴数据,Y轴同样如此,在对应的位置贴上即可

                  xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: xAxis,
                    //设置文本过长超出隐藏...表示 【贴上这段代码即可】
                    axisLabel: {
                      margin: 8,
                      formatter: function(params) {
                        var val = "";
                        var show = 8;
                        if (params.length > show) {
                          val = params.substr(0, show) + '...';
                          return val;
                        } else {
                          return params;
                        }
                      }
                    },
                  },
    

    结果:


    结果示例

    相关文章

      网友评论

          本文标题:echarts:折线图横坐标内容过长省略显示

          本文链接:https://www.haomeiwen.com/subject/yspigktx.html