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"aCode=" + 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"aCode=' + 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}" + ": " + "{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"aCode=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) })