let data1 = [
{
name: '公司1',
value: 2,
sum: 100,
},
{
name: '公司2',
value: 6,
sum: 100,
},
{
name: '公司3',
value: 4,
sum: 500,
},
{
name: '公司4',
value: 3,
sum: 500,
},
{
name: '公司5',
value: 2,
sum: 500,
},
];
let getArrByKey = (data, k) => {
let key = k || 'value';
let res = [];
if (data) {
data.forEach(function (t) {
res.push(t[key]);
});
}
return res;
};
let getSymbolData = (data) => {
let arr = [];
for (var i = 0; i < data.length; i++) {
arr.push({
value: data[i].value,
symbolPosition: 'end',
});
}
return arr;
};
var data = data1
var option = {
backgroundColor: '#061d4d',
grid: {
top: '20px',
bottom: 5,
right: 20,
left: '20px',
containLabel: true,
},
xAxis: {
show: false,
max:8,
},
yAxis: [
{
show: true,
data: getArrByKey(data, 'name'),
axisLine: {
show: false,
},
splitLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
},
{
triggerEvent: true,
show: true,
data: getArrByKey(data, 'name'),
axisLine: {
show: false,
},
splitLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
interval: 0,
shadowOffsetX: '-50px',
color: ['#fff'],
align: 'right',
verticalAlign: 'bottom',
lineHeight: 35,
fontSize: 14,
formatter: function (value, index) {
// return (data[index].value / data[index].sum) * 100
return ``;
},
},
},
],
series: [
{
name: '条',
type: 'bar',
showBackground: true,
yAxisIndex: 0,
data: data,
barWidth: 16,
zlevel: 1,
// align: left,
backgroundStyle: {
color: new echarts.graphic.LinearGradient(
0,
0,
1,
0,
[
{
offset: 1,
color: '#EA5555',
},
{
offset: 0,
color: '#390095',
}
],
false
),
barBorderRadius: 0,
},
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
1,
0,
[
{
offset: 1,
color: '#79D79A',
},
{
offset: 0,
color: '#24873C',
}
],
false
),
barBorderRadius: 0,
},
color: '#35FFF5',
barBorderRadius: 0,
},
label: {
normal: {
color: '#d2d4d9',
show: true,
position: [0, '-20px'],
textStyle: {
fontSize: 14,
},
formatter: function (a, b) {
return a.name;
},
},
},
},
],
};