echarts自定义柱状图

const img1 = {
a: ‘…/…/assets/images/group010/ruzi.png’,
b: ‘…/…/assets/images/group010/ruzi1.png’,
};

const img2 = {
a: ‘…/…/assets/images/group010/rub.png’,
b: ‘…/…/assets/images/group010/rulan1.png’,
};

const img3 = {
a: ‘…/…/assets/images/group010/rucheng.png’,
b: ‘…/…/assets/images/group010/rucheng1.png’,
};
const img4 = {
a: ‘…/…/assets/images/group010/rlv.png’,
b: ‘…/…/assets/images/group010/rulv1.png’,
};

const value = 1; // >0

export const qianKeYongHuOption = {
title: {
text: ’ 用户数量- 自定义柱状图’,
subtext: ‘pictorialBar - 自定义柱状图’,
textStyle: {
color: ‘#fff’,
fontSize: 16
},
left: ‘4.5%’,
top: ‘25%’
},
backgroundColor: ‘#2c343c’,
grid: {
left: ‘2%’,
top: ‘6%’,
bottom: ‘30%’,
right: ‘15%’,
height: ‘90%’,
containLabel: true
},
tooltip: {
trigger: ‘item’,
},
xAxis: {
splitLine: {
show: false
},
axisLine: {
show: false
},
axisLabel: {
show: false
},
axisTick: {
show: false
}
},
yAxis: [{
type: ‘category’,
inverse: false,
data: [‘城区A’, ‘城区B’, ‘城区C’, ‘城区D’],
axisLine: {
show: false
},
axisTick: {
show: false
},
splitLine: {
show: false,
lineStyle: {
type: ‘dashed’,
color: ‘#3e86dd’
}
},
axisLabel: {
margin: 35,
textStyle: {
color: ‘#fff’,
fontSize: 14,
}

}

}

],
series: [
{
tooltip: {
show: false
},
z: 4,
type: ‘pictorialBar’,
symbolSize: [‘25’, ‘25’],
symbolRepeat: ‘fixed’,
data: [{
value,
symbol: ‘image://’ + img1.b,
},
{
value,
symbol: ‘image://’ + img2.b,
},
{
value,
symbol: ‘image://’ + img3.b,
},
{
value,
symbol: ‘image://’ + img4.b,
},
]
},
{
z: 6,
type: ‘pictorialBar’,
symbolSize: [‘25’, ‘25’],
animation: true,
symbolRepeat: ‘fixed’,
symbolClip: true,
symbolPosition: ‘start’,
symbolOffset: [0, 0],
data: [{
value: 60,
symbol: ‘image://’ + img1.a,
},
{
value: 85,
symbol: ‘image://’ + img2.a,
},
{
value: 105,
symbol: ‘image://’ + img3.a,
},
{
value: 130,
symbol: ‘image://’ + img4.a,
},
],
label: {
normal: {
show: true,
textStyle: {
color: ‘#18fcff’,
fontSize: 20,
},
position: ‘right’,
offset: [55, 0]
}
},
},
{
type: ‘bar’
},
]
};