配置项如下
/**
echartsesen :第三方对象 当json里面需要用到时可以使用
myChart:当前统计图对象,可以用来绑定事件使用
datajson:系统生成第三方json,可以在此基础上修改格式,也可以生成全新的,只需要最后用return 返回新格式
*/
var data1 =["江西赣江新区绿地申赣置业有限公司", "南昌欧菲光电技术有限公司", "格特拉克(江西)传动系统有限公司", "南昌亿辰家和文化传媒有限公司", "南昌海立电器有限公司", "南昌兴彰置业有限公司", "南昌临空经济区管理委员会", "南昌市奥克斯电气制造有限公司", "江西晨鸣纸业有限责任公司", "江西润田实业股份有限公司", "江西普盛实业有限公司", "南昌欧菲光学技术有限公司", "南昌欧菲光显示技术有限公司", "发达控股集团有限公司", "江西中烟工业有限责任公司", "南昌金坚房地产开发有限公司", "南昌恒强置业有限公司", "南昌中海豪轩地产有限公司", "南昌欧菲光科技有限公司", "江西腾昌建筑工程有限公司", "南昌临空置业投资有限公司", "南昌辰林房地产有限公司", "江西金资供应链金融服务有限公司", "江西瑞祥置业有限公司", "江西洪城给排水环保设备技术有限责任公司", "南昌中海豪锦地产有限公司", "南昌经济技术开发区管理委员会", "江西坤佳实业有限公司", "江西东帆房地产开发有限公司", "南昌同兴达智能显示有限公司"];//名称
var value2 =["91361200MA3698X76A", "9136010805443033XU", "913600007928030385", "91360108MA3936G053", "913601086697506551", "91360100MA397JJT9P", "123601003146753342", "91360100754215569P", "91360100744264607E", "91360000310571167G", "913601006937238330", "91360108063489632W", "91360108063489595N", "913600001582870640", "91360000767016649W", "91360108MA38KGXK65", "91360108MA35PET144", "91360108MA382EA37R", "913601085638140676", "91360108MA35NA86XU", "91360126309186579G", "91360108MA35J30W0R", "91361200MA37PLRR5Q", "913601000544114700", "91360108556000751H", "91360108MA35PJ072D", "360107000000000gwh", "91360108598864144C", "91360108MA398A7M6C", "91360108MA368YA75L"] ;//代码
var value1 = [20723.65, 11161.49, 10923.37, 10328.45, 10116.32, 9216.65, 8844.86, 7743.13, 7299.48, 7257.21, 6282.13, 5974.26, 5611.31, 5245.36, 5002.49, 4951.72, 4845.77, 4213.3, 4128.95, 4064.44, 3860.57, 3688.23, 3625.72, 3117.74, 3069.54, 3011.18, 2929.57, 2888.22, 2712.35, 2414.09] ;//累计入库
var value3 = [9.37, 6.85, -48.71, 100, 42.31, 100, -2.15, 28.6, -27.31, 117.72, -54.12, 250.1, 554.33, 335.11, 100, 7.45, -58.86, -21.38, 41.03, 24.78, 8.55, -37.36, 154.32, -49.1, 92.66, -85.08, -75, -61.27, 100, 11940.35];//累计增幅
var value4 = ["2", "5", "-2", "999999999", "9", "999999999", "2", "8", "-1", "16", "-7", "40", "89", "62", "999999999", "4", "-12", "0", "12", "7", "3", "-5", "42", "-9", "30", "-24", "-21", "-17", "999999999", "857"];//排名变化
var value5 = ["房地产业", "制造业", "制造业", "租赁和商务服务业", "制造业", "房地产业", "公共管理、社会保障和社会组织", "制造业", "制造业", "制造业", "批发和零售业", "制造业", "制造业", "建筑业", "制造业", "房地产业", "房地产业", "房地产业", "信息传输、软件和信息技术服务业", "建筑业", "租赁和商务服务业", "房地产业", "金融业", "房地产业", "居民服务、修理和其他服务业", "房地产业", "公共管理、社会保障和社会组织", "房地产业", "房地产业", "制造业"];//行业大类
var value6 = 185251;//纳税累计
var value7 = 39.31;//纳税占比
// var data1 =JSON.parse( '<#=GRID54.B3$#>') ;//名称
// var value2 = JSON.parse('<#=GRID54.A3$#>') ;//代码
// var value1 = JSON.parse('<#=GRID54.C3$#>');//累计入库
// var value3 = JSON.parse('<#=GRID54.E3$#>');//累计增幅
// var value4 = JSON.parse('<#=GRID54.M3$#>');//排名变化
// var value5 = JSON.parse('<#=GRID54.N3$#>');//行业大类
// var value6 = '<#=GRID54.C2#>';//纳税累计
// var value7 = '<#=GRID54.E2#>';//纳税占比
var spirit = "image:///asset/get/s/data-1605427519399-b7-DopOXh.png";
console.log(data1);
console.log(value2);
console.log(value1);
console.log(value3);
console.log(value4);
console.log(value5);
console.log(value6);
console.log(value7);
function format(num) {
return (num + '').replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, '$1,');
}
//console.log(value1)
var index = 0;
var colorList = ['#f36c6c', '#e6cf4e', '#20d180', '#0093ff'];
var option = {
backgroundColor:'#000',
title: {
text: '序号\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t企业名称\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t增减幅\t\t\t\t\t\t\t\t\t\t\t\t排名变化',
//subtext:'序号',
show:true,
textStyle: {
color: '#ffffff',
fontWeight: 'bolder',
fontSize: 22
},
subtextStyle: {
color: '#ffffff',
fontWeight: 'bolder',
fontSize: 18
},
top: '30px',
left: 'left'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
show: true,
textStyle:{
fontFamily: '微软雅黑',
fontSize: 22,
color: '#ffffff'
},
formatter:function(params) {
console.log(params);
return '重点税源大户纳税累计'+format(value6)+'万元,占总税收'+value7+'%';
}
},
grid: {
left: 750,
right:100,
top:'5%'
},
xAxis: {
type: 'value',
splitLine: {
show: false
},
axisLabel: {
show: false
},
axisTick: {
show: false
},
axisLine: {
show: false
}
},
yAxis: {
type: 'category',
inverse: true,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisPointer: {
label: {
show: true,
margin: 30
}
},
data: data1,
axisLabel: {
margin: 750,
fontSize: 16,
align: 'left',
color: '#6c778e',
rich: {
a1: {
color: '#fff',
backgroundColor: colorList[0],
fontSize: 24,
width: 30,
height: 30,
align: 'center',
borderRadius: 2
},
a2: {
color: '#fff',
backgroundColor: colorList[1],
fontSize: 24,
width: 30,
height: 30,
align: 'center',
borderRadius: 2
},
a3: {
color: '#fff',
backgroundColor: colorList[2],
fontSize: 24,
width: 30,
height: 30,
align: 'center',
borderRadius: 2
},
b: {
color: '#fff',
// backgroundColor: colorList[3],
fontSize: 24,
width: 30,
height: 30,
align: 'center',
borderRadius: 2
},
c: {
color: '#f1f43a',
backgroundColor: colorList[3],
fontSize: 20,
width: 30,
height: 30,
align: 'center',
borderRadius: 25
},
value: {
color: "#ffd700",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 120
},
percent: {
color: "#ED8600",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 100
},
percent_red: {
color: "#ff4546",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 120
},
percent_green: {
color: "#13ae67",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 120
},
percent_red1: {
color: "#ff4546",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 100
},
percent_green1: {
color: "#13ae67",
fontSize: 24,
align: 'right',
verticalAlign: 'middle',
padding: 4,
width: 100
},
text: {
color: "#fff",
fontSize: 16,
align: 'left',
//verticalAlign: 'middle',
padding: 4,
// width: 400
},
textnew: {
color: "#fff",
fontSize: 16,
align: 'left',
//verticalAlign: 'middle',
padding: 4,
// width: 400
},
newqy: {
backgroundColor:{
// image:'vfs/root/products/ebi/sys/picture/经开区智慧财政/组织收入/新.png'
image:'/asset/get/s/data-1605427519399-b7-DopOXh.png'
},
padding: 4,
width: 24
},
},
formatter: function(params) {
if (index == 30) {
index = 0;
}
index++;
var qymc,zf,pm,hy;
hy=' {c|'+value5[index-1].substring(0,1)+'}';
if(value3[index-1]>0){
if(value4[index-1]=='999999999'){
zf = '';
}else{
zf = '\t{percent_red|' +format(value3[index-1])+'%}';
}
}else{
zf = '\t{percent_green|' +format(value3[index-1])+'%}';
}
if(value4[index-1]=='999999999'){
pm ='';
}else if(value4[index-1]>0){
pm = '\t{percent_red1|' +value4[index-1]+'▲}';
}
else{
pm = '\t{percent_green1|' +value4[index-1]+'▼}';
}
if(value4[index-1]=='999999999'){
qymc = '\t{text|'+'测试123'+'}{newqy|}' ;
}
else{
qymc = '\t{text|'+'测试单位'.padEnd(22 ,' ')+'}' ;//特殊手段强行设置长度,为了对齐
// qymc = '{text|'+params+'}' ;
}
if (index - 1 < 3) {
return [ '{a' + index + '|' + index + '}' +hy +qymc + zf+pm ].join('\n');
} else {
return [ '{b|' + index + '}'+hy +qymc+ zf+pm ].join('\n');
}
}
}
},
series: [{
z: 2,
name: '累计纳税',
// type: 'bar',
type: 'pictorialBar',
symbol: spirit,
symbolRepeat: 'fixed',
symbolMargin: '5%',
symbolClip: true,
symbolSize: 30,
data: value1.map((item, i) => {
itemStyle = {
color: i > 3 ? colorList[3] : colorList[i]
};
return {
value: item,
itemStyle: itemStyle
};
}),
label: {
show: true,
position: 'right',
formatter:function(item){
return (item.value.toFixed(0)+'').replace(/^((\-)?\d{1,3})(?=(\d{3})+(?:$|\.))/g,'$1,');
},
color: '#ffd700',
fontSize: 18,
offset: [10, 0]
}
}
]
};
//return option; //一定要返回新格式