Files
2022-01-11 14:22:25 +08:00

1044 lines
25 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
console.log("哈哈哈哈哈哈哈")
var myChart40 = echarts.init(document.querySelector(".echart40"))
var option40 = {
xAxis: {
type: "value",
// boundaryGap: [0, 0.05],
show: false,
max: 100,
},
yAxis: {
type: "category",
show: false,
},
grid: {
left: 0,
},
series: [{
name: "2021",
type: "bar",
data: ["105"],
itemStyle: {
color: "#269BFF",
borderRadius: 20,
},
barWidth: "10",
showBackground: true,
backgroundStyle: {
borderRadius: 10,
// color: "red",
},
}, ],
}
myChart40.setOption(option40)
var myChart42 = echarts.init(document.querySelector(".echart42"))
// 海绵城市要求
var myChart41 = echarts.init(document.querySelector(".echart41"))
var taskId41 = "249481498440331264"
var quotaCode41 = "Q259698764016517121"
var url2 =
"https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=" +
quotaCode41 +
"&systemName=government"
$.post(url2, function(data) {
var d = unique(data.infoList)
$.post(
"https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/targetProgress.do?taskId=" +
taskId41 +
"&taskSystem=government&quotaCode=" +
quotaCode41,
function(data2) {
var nb_value = (data2.infoList.filter((item) => {
return item['areaName'] == '宁波市'
})[0]['quotaValue']);
console.log("海绵城市的数据",d)
$("#lblmubiao1").html(5+ "%");
$("#lblshiji1").html(parseFloat(nb_value).toFixed(2)+"%");
$("#wancheng").html(parseFloat(nb_value/5*100).toFixed(2)+"%");
var myColor = d.map(function(item) {
var lv = parseFloat(
(item["currentValue"] / item["targetValue"]) * 100
).toFixed(0)
return lv >= 100 ? "#1491FD" : lv > 60 ? "#E89846" : "#FF0332"
})
var option41 = {
grid: {
right: 10,
top: 20,
bottom: 20,
left: 10,
containLabel: true,
},
tooltip: {
formatter: function(params, ticket, callback) {
if (params.data !== undefined) {
var currentValue = d[params.dataIndex]["currentValue"]
if (currentValue == null || currentValue == undefined)
currentValue = 0
var targetValue = d[params.dataIndex]["targetValue"]
return (
params.name +
" " +
parseFloat((currentValue / targetValue) * 100).toFixed(0) +
"%,已完成" +
parseFloat(currentValue).toFixed(2) +
"%,目标:" +
targetValue +
"%"
)
}
},
},
xAxis: {
type: "value",
splitLine: {
show: false,
},
axisLabel: {
show: false,
},
axisTick: {
show: false,
},
axisLine: {
show: false,
},
},
yAxis: [{
type: "category",
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
color: "black",
fontSize: 14,
textStyle: {
color: "black",
},
},
data: d.map(function(item) {
return ningbo_allareas[item["areaCode"]]
}),
max: 10, // 关键设置y刻度最大值相当于设置总体行高
inverse: true,
},
{
type: "category",
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
color: "black",
fontSize: 14,
textStyle: {
color: "black",
},
},
data: d.map(function(item) {
var currentValue = item["currentValue"]
if (currentValue == null || currentValue == undefined)
currentValue = 0
return parseFloat(currentValue).toFixed(2) + "%"
}), //["75%", "70%", "68%", "63%", "55%", "50%", "47%", "43%", "40%", "35%"],
max: 10, // 关键设置y刻度最大值相当于设置总体行高
inverse: true,
},
],
series: [{
name: "条",
type: "bar",
barWidth: 10,
data: d.map(function(item) {
return item["currentValue"]
}), //[75, 70, 68, 63, 55, 50, 47, 43, 40, 35],
barCategoryGap: 20,
itemStyle: {
normal: {
barBorderRadius: 10,
color: function(params) {
// var num = myColor.length;
// return myColor[params.dataIndex % num]
return myColor[params.dataIndex]
},
},
},
zlevel: 1,
},
{
name: "进度条背景",
type: "bar",
barGap: "-100%",
barWidth: 10,
data: d.map(function(item) {
return item["targetValue"]
}), //[100, 100, 100, 100, 100, 100, 100, 100, 100, 100],
color: ["lightgray"],
itemStyle: {
normal: {
barBorderRadius: 10,
},
},
},
],
}
myChart41.setOption(option41)
}
)
})
// 地图部分
// 新建绿道
var myChart43 = echarts.init(document.querySelector(".echart43"))
var taskId43 = "244837774619930624"
var quotaCode43 = "Q249971129640398848"
var url43 =
"https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=" +
quotaCode43 +
"&systemName=government"
$.post(url43, function(data) {
var d = unique(data.infoList)
d.push({ areaCode: "dbxc", currentValue: "0", targetValue: "3" })
var mubiao2 = countTotal(d, 'targetValue');
var nb_value = countTotal(d, 'currentValue');
$("#lblmubiao2").html(mubiao2 +"KM");
$("#lblshiji2").html(nb_value+"KM");
/* $.post('https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/targetProgress.do?taskId=' + taskId3 + '&taskSystem=government&quotaCode=' + quotaCode3, function (data3) {
var nb_value = (data3.infoList.filter((item) => {
return item['areaName'] == '宁波市'
})[0]['quotaValue']);
});
*/
var myColor1 = []
d.forEach(function(item) {
var c =
parseFloat((item["currentValue"] / item["targetValue"]) * 100).toFixed(
0
) < 100 ?
"#FF5C11" :
"#15BE50"
myColor1.push(c)
})
$.get(
"https://sznbs.ningbo.gov.cn:89/szzf/zdrw/fj_zhujianjun/330200_full.json",
function(mapJson) {
echarts.registerMap("宁波市", mapJson)
var option42 = {
title: {
text: "宁波市",
x: "5%",
top: 0,
},
tooltip: {
trigger: "item",
formatter: function(params, ticket, callback) {
if (params.data !== undefined) {
let currentValue = d[params.dataIndex]["currentValue"]
let targetValue = d[params.dataIndex]["targetValue"]
return (
params.name +
" 进度:" +
parseFloat((currentValue / targetValue) * 100).toFixed(0) +
"%,已完成" +
currentValue +
"km,目标:" +
targetValue +
"km"
)
}
},
},
geo: {
show: true,
map: "宁波市",
top: 60,
// left: 50,
// right: 70,
roam: false, //不开启缩放和平移
zoom: 1.23, //视角缩放比例
label: {
normal: {
show: true,
fontSize: "10",
color: "white",
},
},
itemStyle: {
normal: {
color: "red",
borderColor: "rgba(0, 0, 0, 0.2)",
},
emphasis: {
label: {
show: true,
position: "top",
color: "red",
},
areaColor: "#ccc", //鼠标选择区域颜色
shadowOffsetX: 0,
shadowOffsetY: 0,
shadowBlur: 20,
borderWidth: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
regions: [],
},
series: [{
mapType: "宁波市",
type: "map",
label: {
show: true,
},
geoIndex: 0,
data: [],
}, ],
}
d.forEach(function(item) {
// debugger
let c =
parseFloat(
(item["currentValue"] / item["targetValue"]) * 100
).toFixed(0) < 100 ?
"#FF5C11" :
"#15BE50"
option42.geo.regions.push({
name: ningbo_allareas[item["areaCode"]],
itemStyle: {
normal: {
areaColor: c,
},
emphasis: {
areaColor: c,
},
},
label: {
show: true,
},
})
myColor1.push(c)
})
myChart42.setOption(option42)
}
)
var option43 = {
grid: {
right: 60,
top: 5,
bottom: 5,
left: 134,
// containLabel: true,
},
tooltip: {
formatter: function(params, ticket, callback) {
if (params.data !== undefined) {
var currentValue = d[params.dataIndex]["currentValue"]
var targetValue = d[params.dataIndex]["targetValue"]
return (
params.name +
" 进度:" +
parseFloat((currentValue / targetValue) * 100).toFixed(0) +
"%,已完成" +
currentValue +
"km,目标:" +
targetValue +
"km"
)
}
},
},
xAxis: {
type: "value",
splitLine: {
show: false,
},
axisLabel: {
show: false,
},
axisTick: {
show: false,
},
axisLine: {
show: false,
},
},
yAxis: [{
type: "category",
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
color: "black",
fontSize: 14,
textStyle: {
color: "black",
},
},
data: d.map(function(item) {
return ningbo_allareas[item["areaCode"]]
}), //["海曙区", "江北区", "北仑区", "镇海区", "鄞州区", "奉化区", "象山县", "宁海县", "余姚县", "慈溪市"],
// max: 10, // 关键设置y刻度最大值相当于设置总体行高
inverse: true,
},
{
type: "category",
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
color: "black",
fontSize: 14,
textStyle: {
color: "black",
},
},
data: d.map(function(item) {
return (
parseFloat(
(item["currentValue"] / item["targetValue"]) * 100
).toFixed(0) + "% "
)
}),
// max: 10, // 关键设置y刻度最大值相当于设置总体行高
inverse: true,
},
],
series: [{
name: "条",
type: "bar",
barWidth: 10,
data: d.map(function(item) {
return item["currentValue"]
}), //[0.01, 0.7, 0.8, 1, 2.3, 1.1, 1.9, 0.8, 0.8, 2.3],
barCategoryGap: 10,
itemStyle: {
normal: {
barBorderRadius: 10,
color: function(params) {
return myColor1[params.dataIndex]
},
},
},
zlevel: 1,
},
{
name: "进度条背景",
type: "bar",
barGap: "-100%",
barWidth: 10,
data: d.map(function(item) {
return item["targetValue"]
}),
color: ["lightgray"],
itemStyle: {
normal: {
barBorderRadius: 10,
},
},
},
],
}
myChart43.setOption(option43)
})
// 老旧小区改造
var myChart44 = echarts.init(document.querySelector(".echart44"))
var taskId = "228561153135034368"
var quotaCode44 = "Q233988608318586883"
let myColor44 = [
"#e89846",
"#1491fd",
"#1491fd",
"#1491fd",
"#0ec145",
"#1491fd",
"#1491fd",
"#1491fd",
"#1491fd",
"#0ec145",
]
var url44 =
"https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=" +
quotaCode44 +
"&systemName=government"
$.post(url44, function(data) {
var d = unique(data.infoList)
var colors = ["#5c8ff8", "#5c8ff8"]
option44 = {
color: colors,
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
formatter: "{b} {c} ",
},
grid: {
y2: "10%",
height: "60%",
width: "90%",
containLabel: "true",
},
xAxis: [{
type: "category",
axisTick: {
alignWithLabel: true,
},
data: d.map(function(item) {
return ningbo_allareas[item["areaCode"]]
}), //["海曙区", "江北区", "北仑区", "镇海区", "鄞州区", "奉化区", "象山县"],
axisLabel: {
rotate: 30,
fontSize: 14,
},
}, ],
yAxis: [{
type: "value",
min: 0,
// max: 20,
axisLine: {
show: true,
lineStyle: {
// color: colors[0],
},
},
splitLine: { show: false },
axisLabel: {
color: "black",
fontSize: 14,
textStyle: {
color: "black",
},
},
show: true,
// offset: 10,
axisTick: {
show: true,
},
}, ],
series: [{
name: "条",
type: "bar",
barWidth: 20,
// data: d.map(function(item) {
// let currentValue = item["currentValue"]
// if (currentValue == null || currentValue == undefined)
// currentValue = 0
// return parseFloat(currentValue).toFixed(0)
// }),
data: [82, 28, 9, 5, 17, 32, 36, 17],
barCategoryGap: 20,
itemStyle: {
normal: {
barBorderRadius: 2,
// color: function(params) {
// return myColor44[params.dataIndex]
// },
color: "#1491fd",
},
},
zlevel: 1,
label: {
show: false,
position: "inside",
formatter: "{c}",
},
},
// {
// name: "进度条背景",
// type: "bar",
// barGap: "-100%",
// barWidth: 20,
// data: d.map(function(item) {
// let targetValue = item["targetValue"]
// if (targetValue == null || targetValue == undefined) targetValue = 0
// return parseFloat(targetValue).toFixed(0)
// }), //[99, 15, 20, 25, 23, 22, 21, 22, 22, 80],
// color: ["lightgray"],
// //color: d.map(item => 'lightgray'),
// itemStyle: {
// normal: {
// barBorderRadius: 2,
// },
// },
// label: {
// show: true,
// position: "outside",
// formatter: "{c}",
// },
// },
],
}
myChart44.setOption(option44)
})
//污水零直排
var myChart45 = echarts.init(document.querySelector(".echart45"))
$.post("https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=Q233909550121566211&systemName=government", function(data) {
console.log("得到的污水零指派的数据",data)
var d = unique(data.infoList);
var mubiao2 = countTotal(d, 'targetValue');
var currentValues2 = countTotal(d, 'currentValue');
$("#zhongtimubiao").html(currentValues2)
var option45 = {
tooltip: {
trigger: "item",
show: false,
showContent: true,
},
grid: {
top: 0,
left: 0,
bottom: 0,
},
series: [{
type: "pie",
radius: ["60%", "80%"],
avoidLabelOverlap: false,
label: {
show: true,
},
itemStyle: {
color: "#3D9DF4",
},
emphasis: {
label: {
show: true,
fontSize: "40",
fontWeight: "bold",
},
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
labelLine: {
show: false,
},
data: [{
value: currentValues2,
name: (currentValues2/mubiao2*100).toFixed(0) + "%" ,
label: {
position: "center",
fontSize: 16,
},
},
{
value: mubiao2-currentValues2,
// name: "43%",
itemStyle: {
color: "#EEEEEE",
},
label: {
position: "center",
fontSize: 16,
},
},
],
}, ],
}
myChart45.setOption(option45)
})
var myChart46 = echarts.init(document.querySelector(".echart46"))
$.post("https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=Q233909550121566211&systemName=government", function(data) {
var d = unique(data.infoList)
var option46 = {
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
},
formatter: "{b}" + "{a1}" + ":&nbsp;" + "{c0}",
},
legend: {
show: true,
top: 10,
// itemWidth: 5,
// itemHeight: 10,
textStyle: {
color: "#797979",
},
},
grid: {
left: "3%",
right: "0%",
bottom: "0%",
top: "12%",
containLabel: true,
},
yAxis: [{
type: "value",
axisLine: {
lineStyle: {
color: "#D5D5DF",
},
},
axisLabel: {
show: true,
formatter: "{value}",
textStyle: {
color: "#333",
fontSize: 12,
},
},
splitLine: {
//网格线
lineStyle: {
type: "dashed", //设置网格线类型 dotted虚线 solid:实线
},
show: false, //隐藏或显示
},
axisTick: { show: true }, //坐标轴刻度
axisLine: { show: true }, //坐标轴轴线
}, ],
xAxis: {
type: "category",
axisTick: {
show: true,
alignWithLabel: true,
},
axisLabel: {
interval: 0,
margin: 13,
fontSize: 13,
color: "#333",
},
axisLine: {
lineStyle: {
color: "#999",
},
},
data: d.map(function(item) {
return ningbo_allareas[item["areaCode"]]
}),
//["海曙区", "江北区", "北仑区", "镇海区", "鄞州区", "奉化区", "象山县"],
},
series: [{
name: "实际值",
type: "bar",
stack: true,
barWidth: 20, //柱图宽度
color: "#76ddfb",
itemStyle: {
normal: {
color: "#2690f2", //改变折线点的颜色
lineStyle: {
color: "#2690f2", //改变折线颜色
},
},
},
data: d.map(function(item) {
let currentValue = item["currentValue"]
if (currentValue == null || currentValue == undefined)
currentValue = 0
return parseFloat(currentValue).toFixed(0)
}),
/* data: [1, 2, 5, 4, 7, 8, 3, 4],
*/ },
{
name: "目标值",
type: "bar",
barWidth: 20, //柱图宽度
color: "#76ddfb",
itemStyle: {
normal: {
color: "#32c565", //改变折线点的颜色
lineStyle: {
color: "#32c565", //改变折线颜色
},
},
},
stack: true,
data: d.map(function(item) {
let targetValue = item["targetValue"]
if (targetValue == null || targetValue == undefined)
targetValue = 0
return parseFloat(targetValue).toFixed(0)
}),
},
],
}
myChart46.setOption(option46)
})
/* 棚户区改造饼图 */
var myChart47 = echarts.init(document.querySelector(".echart47"))
$.post("https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/targetProgress.do?taskId=228927878624006144&taskSystem=government&quotaCode=Q229210259041894403", function (a, b, c, d) {
console.log("得到棚户数据",a)
$("#phWC").text(parseFloat(a.infoList[0].quotaValue))
var percent = (a.infoList[0].quotaValue / 1526).toFixed(2) * 100
var option47 = {
tooltip: {
trigger: "item",
formatter: "{b} {c} %",
},
graphic: {
type: "text",
left: "center",
top: "center",
width: 30,
style: {
text: percent > 100 ? "超额完成" : percent + "%",
fill: "#228DF8",
fontSize: 18,
fontWeight: 700,
},
},
series: [
{
name: "",
type: "pie",
radius: ["70%", "90%"],
avoidLabelOverlap: false,
label: {
show: false,
},
emphasis: {
label: {
show: false,
},
},
labelLine: {
show: true,
},
data: [
{
value: percent,
name: "",
itemStyle: {
normal: {
color: "#3E9DF4",
label: {
show: true,
formatter: "{c}%",
},
},
},
},
],
},
],
}
myChart47.setOption(option47)
})
/* 棚户区改造柱状图 */
var myChart48 = echarts.init(document.querySelector(".echart48"))
$.get("https://szzf.nbjs.gov.cn:8050/api/Rural_vitalization/GetNewlyStartedShantytownReconstruction", function (data){
var colors = ["#31C563"]
option488 = {
color: colors,
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
grid: {
//绘图区调整
x: 52, //左留白
y: 10, //上留白
// x2: 10, //右留白
y2: 10, //下留白
},
xAxis: [
{
show: false,
},
],
yAxis: [
{
type: "category",
data: data.data.map(function (item) {
return item["area_name"]
}),
axisLine: {
show: false,
}, //坐标轴
axisTick: [
{
//坐标轴小标记
show: false,
},
],
axisLabel: {
textStyle: {
fontSize: "14",
},
},
},
],
series: [
{
name: "套",
type: "bar",
tooltip: {
show: false,
},
barMinHeight: 30, //最小柱高
barWidth: 35, //柱宽度
barMaxWidth: 100, //最大柱宽度
data: data.data.map(function (item) {
return item.para_value1
}),
itemStyle: {
normal: {
//柱状图颜色
color: "#31C563",
label: {
show: true, //显示文本
position: "inside", //数据值位置
textStyle: {
color: "#000",
fontSize: "14",
},
},
},
},
},
],
}
myChart48.setOption(option488)
})
var taskId2 = "228927878624006144"
var quotaCode48 = "Q229210259041894403"
var url48 =
"https://sznbs.ningbo.gov.cn:89/nbszhjkzz/tojcms/getQuotaByTaksIdOrQuotaCode.do?parentQuotaCode=" +
quotaCode48 +
"&systemName=government"
$.post(url48, function(data) {
var colors48 = ["#31C563"]
var option48 = {
title: {
text: "",
subtext: "",
},
color: colors48,
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
grid: {
left: 50,
},
xAxis: [{
show: false,
type: "value",
boundaryGap: [0, 0.01],
position: "top",
}, ],
yAxis: [{
type: "category",
data: ["镇海区", "奉化区"],
axisLine: {
show: false,
}, //坐标轴
axisTick: [{
//坐标轴小标记
show: false,
}, ],
axisLabel: {
textStyle: {
fontSize: "14",
},
},
}, ],
series: [{
name: "套",
type: "bar",
tooltip: {
show: false,
},
barGap: 10,
barMinHeight: 30, //最小柱高
barWidth: 20, //柱宽度
barMaxWidth: 100, //最大柱宽度
data: [548, 1080],
itemStyle: {
normal: {
//柱状图颜色
color: "#31C563",
label: {
show: true, //显示文本
position: "inside", //数据值位置
textStyle: {
color: "#000",
fontSize: "14",
},
},
},
},
}, ],
}
myChart48.setOption(option48)
})