var newData = {
yAxis: [
{
"name": "出货",
"value": [
10,
20,
30,
3,
15,
16,
19,
20,
23,
12,
13,
15,
16,
18,
56,
17,
18,
88,
22,
16,
11,
33,
53,
63,
13,
15,
16,
50,
29,
1,
7,
1,
0,
0,
1,
0,
2,
2,
1,
4,
1,
3,
1,
4,
3,
4,
2,
4,
1,
15,
2,
3,
0,
3,
1,
4,
3,
4,
2,
1,
1,
1,
11,
1,
1,
0,
8,
1,
1,
9,
1,
3,
8,
7,
6,
3,
5,
100,
16,
15,
3,
7,
11,
13,
52,
11,
32,
22
]
}
],
xAxis: [
"苏坡街道",
"西华街道",
"花源街道",
"新都街道",
"三河街道",
"同安街道",
"唐昌镇",
"友爱镇",
"西航港街道",
"东升街道",
"茶店子街道",
"安仁镇",
"康河街道",
"沙河街道",
"桂溪街道",
"转龙镇",
"锦官驿街道",
"淮口街道",
"洛带镇",
"龙泉街道",
"云合镇",
"文君街道",
"桂湖街道",
"郫筒街道",
"龙池镇",
"天马镇",
"团结街道",
"川菜管委会",
"青城山镇",
"涌泉街道",
"十陵街道",
"射洪坝街道",
"羊马街道",
"石桥街道",
"元通镇",
"黄水镇",
"万春镇",
"望江路街道",
"安德街道",
"天彭街道",
"黄甲街道",
"固驿街道",
"临邛街道",
"赵镇街道",
"鹤山街道",
"崇庆街道",
"荷花池街道",
"柏合街道",
"金马街道",
"柳城街道",
"中和街道",
"五津街道",
"西来镇",
"红光街道",
"奎光塔街道",
"简城街道",
"天府街道",
"公平街道",
"籍田街道",
"永商镇",
"栖贤街道",
"西河街道",
"二仙桥街道",
"晋原街道",
"太平街道",
"弥牟镇",
"华阳街道",
"现代交通产业功能区",
"石羊街道",
"崇阳街道",
"隆兴镇",
"德源街道",
"大面街道",
"灌口街道",
"龙潭街道",
"彭镇",
"绿色氢能管委会",
"猛追湾街道",
"驷马桥街道",
"宝墩镇",
"青霞街道",
"幸福街道",
"犀浦街道",
"煎茶街道",
"草堂街道",
"西园街道",
"银杏街道",
"永宁街道"
]
}
const colorArr = ['#2F8FFF', '#47B558', '#FFC328'];
let seriesData = [];
let legendData = [];
seriesData = newData.yAxis.map((item, index) => {
return {
name: item.name,
type: 'bar',
barMaxWidth: 10, //柱子宽度
itemStyle: {
normal: {
color: colorArr[index],
},
},
label: {
show: true,
color: colorArr[index],
fontSize: 14,
position: 'top', // 显示位置，可选值有 'top', 'bottom', 'inside', 'outside'
formatter: '{c}', // 标签内容格式器，这里表示显示数据值
},
data: item.value,
}
});
legendData = newData.yAxis.map((item) => item.name);
option = {
grid: {
containLabel: true,
bottom: '5%',
top: '10%',
left: '1%',
right: '1%',
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
},
},
dataZoom: [
{
show: true,
type: 'slider',
backgroundColor: 'rgba(38,159,255, 0.3)',
fillerColor: '#409EFF', // rgb(16, 171, 198)
borderColor: 'rgba(38,159,255, 0.3)',
showDetail: false,
filterMode: 'empty',
showDataShadow: false,
brushSelect: false, // 是否开启刷选功能
height: 10,
handleSize: 0,
xAxisIndex: [0],
zoomLock: true, // 是否锁定选择区域（或叫做数据窗口）的大小
throttle: 100, // 设置触发视图刷新的频率。
realtime: true,
bottom: '1%',
startValue: 0,
endValue: 13,
}
],
legend: {
top: '0%',
right: '7%',
data: legendData,
itemWidth: 18,
itemHeight: 18,
itemGap: 30,
textStyle: {
fontSize: 18,
color: '#000',
padding: [0, 0, 0, 5],
},
},
xAxis: {
data: newData.xAxis,
axisLabel: {
show: true,
fontSize: 14,
color: '#000',
interval: 0, // 强制显示所有标签
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
},
yAxis: [
{
axisLabel: {
show: true,
fontSize: 18,
color: '#000',
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
lineStyle: {
color: '#000',
},
},
},
],
series: seriesData,
};