echarts名字处理,换行、倾斜、竖排显示
名字太长换行处理
yAxis: { type: 'category', data: ['水罐消防车', '泡沫消防车', '压缩空气泡沫消防车', '举高喷射消防车', '干粉消防车'], axisLabel: { interval: 0, align:'right', formatter : function(params){ var newParamsName = "";// 最终拼接成的字符串 var paramsNameNumber = params.length;// 实际标签的个数 var provideNumber = 5;// 每行能显示的字的个数 var rowNumber = Math.ceil(paramsNameNumber / provideNumber);// 换行的话,需要显示几行,向上取整 /** * 判断标签的个数是否大于规定的个数, 如果大于,则进行换行处理 如果不大于,即等于或小于,就返回原标签 */ // 条件等同于rowNumber>1 if (paramsNameNumber > provideNumber) { /** 循环每一行,p表示行 */ 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 } }, },

名字竖排显示
xAxis: { axisLabel:{ interval: 0, formatter: function (value) { //x轴的文字改为竖版显示 var str = value.split(""); return str.join("\n"); }, textStyle: { color: '#666666' //color of value } }, type: 'category', data: ['玄武区','秦淮区','建邺区','鼓楼区','浦口区','栖霞区','雨花台区','江宁区','六合区','溧水区','高淳区'] },

文字倾斜处理
xAxis: { axisLabel:{ interval: 0, //必须带的属性 rotate:270 //倾斜角度 }, type: 'category', data: ['01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00' , '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00'] },

 
                    
                 
                
            
         浙公网安备 33010602011771号
浙公网安备 33010602011771号