原图
代码
option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
formatter:function(params)
{
var relVal = params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
if(params[i].value!=''){
if(params[i].value==0){
return relVal += '<br/>' + params[i].seriesName + ' : ' + params[i].value;
}else{
return relVal += '<br/>' + params[i].seriesName + ' : ' + params[i].value+"K";
}
}
}
}
},
grid: {
top:'10%',
left: '3%',
right: '10%',
bottom: '20%',
containLabel: true
},
xAxis : [
{
type : 'value'
}
],
yAxis : [
{
type : 'category',
axisTick : {show: false},
data : ["UAT","Pre-Production","Prod","PRD","Test","Production"],
axisLabel: {
color: "#000",
interval: 0,
formatter: function(value) {
if (value.length > 8) {
return value.substring(0, 8) + "...";
} else {
return value;
}
}
}
}
],
series : [
{
name:'账单金额',
type:'bar',
stack: '总量',
itemStyle: {
normal: {
color: "#4682B4",
lineStyle: {
color: "#4682B4"
}
}
},
label: {
normal: {
show: true,
position: 'inside',
formatter: function (param) {
return param.value==0 ? param.value:param.value+'k';
}
}
},
data:[{value: "-12"},{value: "-11"},{value: "-2"},{value: ""},{value: ""},{value: ""}]
},
{
name:'账单金额',
type:'bar',
stack: '总量',
itemStyle: {
normal: {
color: "#FF7F50",
lineStyle: {
color: "#FF7F50"
}
}
},
label: {
normal: {
show: true,
position: 'inside',
formatter: function (param) {
return param.value==0 ? param.value:param.value+'k';
}
}
},
data:[{value: ""},{value: ""},{value: ""},{value: "1"},{value: "2"},{value: "9"}]
}
]
};
需求:将负号’-'去掉 负数的柱子仍然在左边
解决方案:关键代码 Math.abs() 去除负号即可
将
return param.value==0 ? param.value:param.value+'k';
改为如下即可
return Math.abs(param.value)==0 ? Math.abs(param.value):Math.abs(param.value)+'k';
效果