看图,有问题的

解决之后,倾斜显示全部内容,也可以显示两行文字内容

局部代码
xAxis: {
type: 'category',
axisLabel:{
interval: 0,
rotate: '45',
lineHeight: 18,
formatter : function(params){
var newParamsName = "";
var paramsNameNumber = params.length;
var provideNumber = 10;
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
}
},
data: data.data.map((item) => item.name)
},
全部代码
<div id="echartsCall_ranking2" style="width: 100%;height: 364px;"></div>
let devNeedData =[
{name: "余三三", value: 13}, {name: "伊三三", value: 12}, {name: "李三三", value: 10.5},
{name: "杨三三黄三三黄三三黄三三黄三三", value: 11.5},{name: "丁三三", value: 10.5},{name: "李三三", value: 12},
{name: "黄三三", value: 9.5},{name: "刘X", value: 12.5},{name: "李X", value: 12},
{name: "郑三三", value: 7.5},{name: "盛三三", value: 13},{name: "林三三", value: 9.5},
{name: "黄三三", value: 13.5},{name: "黄三三", value: 11},{name: "刘三三", value: 12},
{name: "凌三三", value: 3.7}, {name: "任三三", value: 0.5}, {name: "彭X", value: 0.5}
]
var chartFnc = {
init: function() {
this.initBar2('echartsCall_ranking2', {
title: {
text: '开发人员实际需求故事点',
left: '40%',
bottom: '0',
textStyle: {
fontSize: '14'
}
},
grid: {
left: '3%',
right: '5%',
bottom: '5%',
containLabel: true
},
markLine: {
data: [{ type: 'average', name: '平均值' }]
},
data: devNeedData
})
},
initBar2(id, data) {
var chartDom = document.getElementById(id)
var myChart = echarts.init(chartDom)
var option
option = {
title: data.title,
grid: data.grid || {},
xAxis: {
type: 'category',
axisLabel:{
interval: 0,
rotate: '45',
lineHeight: 18,
formatter : function(params){
var newParamsName = "";
var paramsNameNumber = params.length;
var provideNumber = 10;
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
}
},
data: data.data.map((item) => item.name)
},
yAxis: {
type: 'value'
},
series: [
{
data: data.data.map((item) => item.value),
type: 'bar',
label: {
show: true,
position: 'top'
},
markLine: data.markLine || {}
}
]
}
myChart.setOption(option);
},
chartFnc.init();
});