本文主要是介绍ECharts 设置柱状图的每个柱子的颜色不一样 ,显示数据,并自定义单位,,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
效果图
series: [
{
type: 'bar',
barCategoryGap:'40%',
//设置柱子的颜色
itemStyle: {
normal: {
color: function(params) {
// build a color map as your need.
var colorList = [
'#ffb400','#00ff4e','#ff0000','#00ddff','#baff00',
'#00ff06'
];
return colorList[params.dataIndex]
}
}
},
//设置柱子的数据,并且居右边+单位
label: {
normal: {
show: true,
formatter: '{b}({c}万)',
position: "right",
textStyle: {
color: "#fff",
fontSize: 14
}
}
},
data:[
{
value:10,name:'生产加工'
},
{
value:'7',name:'主管部门'
},
{
value:'5',name:'物资企业'
},
{
value:'3',name:'加工企业'
},
{
value:'2',name:'经销企业'
},
{
value:'10',name:'其他'
}
],
}
]
};
这篇关于ECharts 设置柱状图的每个柱子的颜色不一样 ,显示数据,并自定义单位,的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!