echarts 的柱状图 填充色为透明

itemStyle控制柱形的样式。如下：

itemStyle: {
normal: {
color: '#fff', //填充色
barBorderColor: '#4876FF', //边框色
barBorderWidth: 3, //边框宽度
barBorderRadius:2, //圆角半径
label : { //标签显示位置
show: true,
position: 'top' //insideTop 或者横向的 insideLeft

}
}
}

例子：

 

option = {
title : {
text: '世界人口总量',
subtext: '数据来自网络'
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['2011年', '2012年']
},
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
xAxis : [
{
type : 'value',
boundaryGap : [0, 0.01]
}
],
yAxis : [
{
type : 'category',
data : ['巴西','印尼','美国','印度','中国','世界人口(万)']
}
],
series : [
{
name:'2011年',
type:'bar',
itemStyle: {
normal: {
color: '#fff',
barBorderColor: '#4876FF',
barBorderWidth: 3,
barBorderRadius:2,
label : {
show: true,
position: 'insideLeft'

}
}
},
data:[18203, 23489, 29034, 104970, 131744, 630230]
},
{
name:'2012年',
type:'bar',
itemStyle: {
normal: {
color: '#fff',
barBorderColor: '#4876FF',
barBorderWidth: 3,
barBorderRadius:2,
label : {
show: true,
position: 'top'

}
}
},
data:[19325, 23438, 31000, 121594, 134141, 681807]
}
]
};

转载于:https://www.cnblogs.com/IT-shen/p/4244086.html