美文网首页
x轴数组全部显示

x轴数组全部显示

作者: 蚁丶点 | 来源:发表于2019-03-06 19:49 被阅读0次

    xAxis: [{
    data: dataArrDept,
    axisLabel:{
    interval: 0
    }
    }],

    x若出现折叠解决方案(https://blog.csdn.net/kebi007/article/details/68488694/
    axisLabel:{
    interval: 0,
    rotate:20//倾斜角度
    }

                axisLabel:{
                    interval: 0,
                    formatter:function(value)
                    {
                        return value.split("-").join("\n");
                    }
                }
    

    项目格式化
    ,
    axisLabel: {
    interval: 0,
    formatter:function(value)
    {
    var ret = "";//拼接加\n返回的类目项
    var maxLength = 5;//每项显示文字个数
    var valLength = value.length;//X轴类目项的文字个数
    var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
    if (rowN > 1)//如果类目项的文字大于3,
    {
    for (var i = 0; i < rowN; i++) {
    var temp = "";//每次截取的字符串
    var start = i * maxLength;//开始截取的位置
    var end = start + maxLength;//结束截取的位置
    //这里也可以加一个是否是最后一行的判断,但是不加也没有影响,那就不加吧
    temp = value.substring(start, end) + "\n";
    ret += temp; //凭借最终的字符串
    }
    return ret;
    }
    else {
    return value;
    }
    }
    }

    鼠标提示

                            tooltip: {},
    

    每项显示具体数据

                            barMaxWidth:34,
                            itemStyle: {
                                normal: {
                                    color: '#4F81BD',
                                    label: {
                                        show: true,
                                        position: 'top',
                                        formatter: '{c}',
                                         textStyle: {
                                            color: '#444'
                                        }
                                    }
                                }
                            }

    相关文章

      网友评论

          本文标题:x轴数组全部显示

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