draw(){
let myChartDrawer = this.$echarts.init(document.getElementById(‘column’));
var colorList = [
["#E56E6E"],
["#FEB763"],
["#00C0DD"],
["#23C83E"],
["#1AA291"],
["#4186EC"],
["#1AEDF4"],
["#31D76B"],
["#FE7C2D"],
["#D7C046"]
];//定义每条柱状颜色
let option = {
title: {},
tooltip: {trigger: “axis”},
grid: {
x: 95, //左留白
y: 10, //上留白
x2: 35, //右留白
y2: 30 //下留白
},
calculable: true,
dataset: {
dimensions: [“goods_name”, “trade_num”],
source: [
{ goods_name: “东湖配变”, trade_num: 8 },
{ goods_name: “西河5/6”, trade_num: 8 },
{ goods_name: “lmn”, trade_num: 7 },
{ goods_name: “赵庄5/6”, trade_num: 6 },
{ goods_name: “甘肃”, trade_num: 6 },
{ goods_name: “台区6”, trade_num: 6 },
{ goods_name: “台区7”, trade_num: 6 },
{ goods_name: “台区8”, trade_num: 6 },
{ goods_name: “台区9”, trade_num: 6 },
{ goods_name: “台区10”, trade_num: 6 },
]
},
xAxis: [
{
splitLine: {
show: false
},
type: "value",
axisLine: {
show: false,
lineStyle: {
color: "rgba(255, 255, 255, 0.3)",
width: 1
}
},
axisTick: {
show: false
},
axisLabel: {
show: true,
margin: 100,
textStyle: {
align: "left",
color: "#00FFFF",
fontSize: 10
}
}
}
],
yAxis: [
{
type: "category",
inverse: true,
axisLine: {
lineStyle: {
color: "rgba(255, 255, 255, 0.2)",
width: 1
}
},
axisLabel: {
show: true,
textStyle: {
color: function(value, index) {
return colorList[index]
},
fontSize: 12
},
formatter: function(value, index) {
return (index + 1) + " " + value;
},
}
}
],
series: [
{
type: "bar",
barWidth:10,
label: {
normal: {
position: 'right',
show: true,
color: function(params) {
var _this = this;
var index = params.dataIndex;
return colorList[index]
}
}
},
itemStyle: {
normal: {
color: function(params) {
var _this = this;
var index = params.dataIndex;
return colorList[index];//设置颜色`在这里插入代码片`
}
}
},
}
]
};
myChartDrawer.setOption(option);
}