可视化图表

最新推荐文章于 2024-08-07 16:25:32 发布

L_F_Code

最新推荐文章于 2024-08-07 16:25:32 发布

阅读量74

点赞数

文章标签： echarts

本文链接：https://blog.csdn.net/L_F_Code/article/details/120458954

版权

echarts 柱状图 - 坐标的相关配置项

坐标轴操作显示

// 坐标轴 - 配置
xAxis: [{
     type: "category",
     data: ['车辆内饰', '车辆外饰', '发动机和引擎设备'],
     axisLabel: {
         interval: 0,
         //rotate: 45,
         //  定义坐标轴的数据换行与否
         formatter:function(params) {
                        var newParamsName = "";
                        var paramsNameNumber = params.length;
                        var provideNumber = 7;  //一行显示几个字
                        var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
                        if (paramsNameNumber > provideNumber) {
                            for (var p = 0; p < rowNumber; p++) {
                                var tempStr = "";
                                var start = p * provideNumber;
                                var end = start + provideNumber;
                                if (p == rowNumber - 1) {
                                    tempStr = params.substring(start, paramsNameNumber);
                                } else {
                                    tempStr = params.substring(start, end) + "\n";
                                }
                                newParamsName += tempStr;
                            }

                        } else {
                            newParamsName = params;
                        }
                        return newParamsName ;
                    },
     },
     "axisLine": {       // 轴线
         "show":false
     },
     "axisTick": {       // 轴刻度线
         "show":false
     },
     "splitLine": {     //网格线
         "show": true
       }
 }],