shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

[完善]地图

master
邵佳豪 10 months ago
parent
1d34e328e3
commit
ed1f680b76
3 changed files with 643 additions and 519 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 26
      src/app/gis-management/gis-labeling/gis-labeling.component.ts
  2. 604
      src/app/statistic-analysis/home/home.component.ts
  3. 4
      src/index.html

26
src/app/gis-management/gis-labeling/gis-labeling.component.ts
Unescape View File

@ -121,7 +121,12 @@ export class GisLabelingComponent implements OnInit {
}); });
}); });
} }
ngOnInit(): void { isHN = false; //是否是海南
async ngOnInit(): Promise<void> {
await this.getProfiles();
this.Profiles.organizationName.indexOf("海南") !== -1
? (this.isHN = true)
: (this.isHN = false);
window.setTimeout(() => { window.setTimeout(() => {
this.mapInit(); this.mapInit();
}, 0); }, 0);
@ -182,6 +187,16 @@ export class GisLabelingComponent implements OnInit {
}); });
} }
Profiles;
getProfiles() {
return new Promise<void>((resolve, reject) => {
this.http.get("/api/Account/Profiles").subscribe((res) => {
this.Profiles = res;
resolve();
});
});
}
//构造重点单位checkbox控制器 //构造重点单位checkbox控制器
buildUnits() { buildUnits() {
const arr = this.keyUnitList.map((item) => { const arr = this.keyUnitList.map((item) => {
@ -287,7 +302,7 @@ export class GisLabelingComponent implements OnInit {
ketUnitSubmit(value) { ketUnitSubmit(value) {
if (this.markers.length == 0) { if (this.markers.length == 0) {
let paramsdata: any = { let paramsdata: any = {
PageSize: 99999, PageSize: 9999,
BuildingTypeIdList: BuildingTypeIdList:
this.selectedUnitList.length != 0 ? this.selectedUnitList : ["123"], this.selectedUnitList.length != 0 ? this.selectedUnitList : ["123"],
}; };
@ -322,7 +337,7 @@ export class GisLabelingComponent implements OnInit {
if (this.unitAreaDefault == "-1") { if (this.unitAreaDefault == "-1") {
//如果勾选全部 //如果勾选全部
let paramsdata: any = { let paramsdata: any = {
PageSize: 99999, PageSize: 9999,
BuildingTypeIdList: BuildingTypeIdList:
this.selectedUnitList.length != 0 ? this.selectedUnitList : ["123"], this.selectedUnitList.length != 0 ? this.selectedUnitList : ["123"],
}; };
@ -1264,7 +1279,7 @@ export class GisLabelingComponent implements OnInit {
features: ["bg", "road", "point", "building"], features: ["bg", "road", "point", "building"],
mapStyle: "amap://styles/light", mapStyle: "amap://styles/light",
}); });
this.map.setCity("上海市"); this.isHN ? this.map.setCity("海南省") : this.map.setCity("上海市");
} }
this.satelliteModel = false; this.satelliteModel = false;
this.loadModel = false; this.loadModel = false;
@ -1284,7 +1299,7 @@ export class GisLabelingComponent implements OnInit {
layers: [layer], layers: [layer],
WebGLParams: { preserveDrawingBuffer: true }, WebGLParams: { preserveDrawingBuffer: true },
}); });
that.map.setCity("上海市"); this.isHN ? that.map.setCity("海南省") : that.map.setCity("上海市");
that.mouseTool = MapFactory.MouseToolInstance(that.map); that.mouseTool = MapFactory.MouseToolInstance(that.map);
} }
@ -1744,7 +1759,6 @@ export class GisLabelingComponent implements OnInit {
console.log("走这里了吗2", that.routeStartList); console.log("走这里了吗2", that.routeStartList);
that.routeStartList = []; that.routeStartList = [];
setTimeout(() => { setTimeout(() => {
that.routeStartList = [...result.tips]; that.routeStartList = [...result.tips];
console.log("走这里了吗3", that.routeStartList); console.log("走这里了吗3", that.routeStartList);

604
src/app/statistic-analysis/home/home.component.ts
Unescape View File

@ -1,50 +1,52 @@
import { Component, OnInit, Renderer2, ElementRef } from '@angular/core'; import { Component, OnInit, Renderer2, ElementRef } from "@angular/core";
import { HttpClient } from '@angular/common/http' import { HttpClient } from "@angular/common/http";
import { Router } from '@angular/router'; import { Router } from "@angular/router";
import { EchartsDataService } from '../echarts-data.service'; import { EchartsDataService } from "../echarts-data.service";
import { MapFactory } from '@src/modules/map/declare/factory'; import { MapFactory } from "@src/modules/map/declare/factory";
import { IMap } from '@src/modules/map/declare/map'; import { IMap } from "@src/modules/map/declare/map";
declare var echarts: any; declare var echarts: any;
@Component({ @Component({
selector: 'app-home', selector: "app-home",
templateUrl: './home.component.html', templateUrl: "./home.component.html",
styleUrls: ['./home.component.scss'] styleUrls: ["./home.component.scss"],
}) })
export class HomeComponent implements OnInit { export class HomeComponent implements OnInit {
constructor(
constructor(private http: HttpClient, private render2: Renderer2, public element: ElementRef, private router: Router, public emitService: EchartsDataService) { } private http: HttpClient,
private render2: Renderer2,
public element: ElementRef,
private router: Router,
public emitService: EchartsDataService
) {}
map: IMap; //地图 map: IMap; //地图
yuandata yuandata;
ngOnInit() { ngOnInit() {
this.getechartsdata() this.getechartsdata();
this.getYearlyCompleteProgress() this.getYearlyCompleteProgress();
window.setTimeout(() => { window.setTimeout(() => {
/* this.unitType() this.mapInit(); //初始化地图
this.unitData() }, 0);
this.keyUnit() */
this.mapInit() //初始化地图
}, 0)
} }
//获得年度完成情况 //获得年度完成情况
completeProgress: any = { completeProgress: any = {
monthlyCompleteProgress: '', monthlyCompleteProgress: "",
yearlyCompleteProgress: '' yearlyCompleteProgress: "",
} };
getYearlyCompleteProgress() { getYearlyCompleteProgress() {
this.http.get('/api/StatisticsAnalysis/Companies/YearlyCompleteProgress').subscribe((data) => { this.http
.get("/api/StatisticsAnalysis/Companies/YearlyCompleteProgress")
.subscribe((data) => {
// console.log('获得年度完成情况', data) // console.log('获得年度完成情况', data)
this.completeProgress = data this.completeProgress = data;
}) });
} }
integrity(width) { integrity(width) {
let style: any = {} let style: any = {};
style.width = width + '%'; style.width = width + "%";
return style return style;
} }
//更新echarts视图 //更新echarts视图
@ -54,34 +56,37 @@ export class HomeComponent implements OnInit {
this.chartZdgzqy.resize() this.chartZdgzqy.resize()
} */ } */
//获取数据 //获取数据
ordata ordata;
buildtableData buildtableData;
lengthdata = []//建筑提示数据 lengthdata = []; //建筑提示数据
buildcount = 0//建筑总数 buildcount = 0; //建筑总数
indexData = []//建筑所有数据 indexData = []; //建筑所有数据
async getechartsdata() { async getechartsdata() {
let paramsdata: any = { let paramsdata: any = {
OrganizationId: this.orid || '', OrganizationId: this.orid || "",
//organizationId:'1' //organizationId:'1'
} };
//获取组织机构数据 //获取组织机构数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Companies`) await this.emitService.getData(
this.ordata = JSON.parse(JSON.stringify(this.emitService.allDate)) paramsdata,
console.log(this.ordata) `/api/StatisticsAnalysis/Companies`
this.keyUnitNum = this.ordata[0].organizationStatistics.totalCount );
this.unitData() this.ordata = JSON.parse(JSON.stringify(this.emitService.allDate));
console.log(this.ordata);
this.keyUnitNum = this.ordata[0].organizationStatistics.totalCount;
this.unitData();
//获取预案状态统计数据 //获取预案状态统计数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Plans`) await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Plans`);
this.unitType() this.unitType();
//获取建筑类型统计数据 //获取建筑类型统计数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/BuildingTypes`) await this.emitService.getData(
this.keyUnit() paramsdata,
`/api/StatisticsAnalysis/BuildingTypes`
);
this.keyUnit();
} }
//获取年度完成情况数据 //获取年度完成情况数据
getYearData() { getYearData() {}
}
threePlan() { threePlan() {
// this.router.navigate(['/planManagement/entryPlan']) // this.router.navigate(['/planManagement/entryPlan'])
@ -98,190 +103,265 @@ export class HomeComponent implements OnInit {
//计划更新页面跳转 //计划更新页面跳转
scheduled() { scheduled() {
this.router.navigate(['/statisticanalysis/scheduledUpdates']) this.router.navigate(["/statisticanalysis/scheduledUpdates"]);
} }
ngOnDestroy(): void { ngOnDestroy(): void {}
}
//初始化地图 //初始化地图
adcode: any //行政编码 adcode: any; //行政编码
level = sessionStorage.getItem("level")//组织级别 level = sessionStorage.getItem("level"); //组织级别
orid orid;
//封装Gaode //封装Gaode
getEchartsData(data) { getEchartsData(data) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let paramsdata: any = { let paramsdata: any = {
name: data.properties.name, name: data.properties.name,
level: Number(this.level) + 1 level: Number(this.level) + 1,
} };
this.http.get("/api/Organizations/GetIdByName", { params: paramsdata }).subscribe((data: any) => { this.http
this.orid = data[0] .get("/api/Organizations/GetIdByName", { params: paramsdata })
this.getechartsdata() .subscribe((data: any) => {
resolve('success') this.orid = data[0];
}) this.getechartsdata();
}) resolve("success");
});
});
} }
setEchartsData() { setEchartsData() {
this.orid = '' this.orid = "";
this.getechartsdata() this.getechartsdata();
} }
//封装Gaode //封装Gaode
mapInit() { mapInit() {
//创建地图 //创建地图
this.map = MapFactory.MapInstance('chartMap', { this.map = MapFactory.MapInstance("chartMap", {
cursor: 'default', cursor: "default",
zooms: [8, 16], zooms: [8, 16],
mapStyle: "amap://styles/grey", mapStyle: "amap://styles/grey",
}); });
this.map.setAdministrativeAreaStyle(this, this.getEchartsData, this.setEchartsData) this.map.setAdministrativeAreaStyle(
} this.getEchartsData,
planNum = [] this.setEchartsData
keyUnitNum );
dataGetNum = 6578 }
planNum = [];
threePlanNum = "0" keyUnitNum;
twoPlanNum = "0" threePlanNum = "0";
cardPlanNum = "0" twoPlanNum = "0";
otherPlanNum = "0" cardPlanNum = "0";
otherPlanNum = "0";
aPlan = '0'
bPlan = '0' aPlan = "0";
cPlan = '0' bPlan = "0";
dPlan = '0' cPlan = "0";
ePlan = '0' dPlan = "0";
ngAfterViewInit(): void { ePlan = "0";
} ngAfterViewInit(): void {}
planState planState;
//预案状态统计 //预案状态统计
pagedata pagedata;
pagedataCount pagedataCount;
unitType() { unitType() {
this.planNum = [] this.planNum = [];
this.pagedata = JSON.parse(JSON.stringify(this.emitService.allDate)) this.pagedata = JSON.parse(JSON.stringify(this.emitService.allDate));
console.log(this.pagedata) console.log(this.pagedata);
this.pagedataCount = String(this.pagedata[0].planStatusStatistics.totalCount) this.pagedataCount = String(
this.pagedata[0].planStatusStatistics.totalCount
);
for (var i = 0; i < this.pagedataCount.length; i++) { for (var i = 0; i < this.pagedataCount.length; i++) {
this.planNum.push(this.pagedataCount[i]) this.planNum.push(this.pagedataCount[i]);
} }
//this.planNum.push(this.pagedataCount.split(',')) //this.planNum.push(this.pagedataCount.split(','))
if (this.pagedata[0].planTypeStatistics.planTypes.length <= 0) { if (this.pagedata[0].planTypeStatistics.planTypes.length <= 0) {
this.threePlanNum = '0' this.threePlanNum = "0";
this.twoPlanNum = '0' this.twoPlanNum = "0";
this.cardPlanNum = '0' this.cardPlanNum = "0";
this.otherPlanNum = '0' this.otherPlanNum = "0";
} else { } else {
this.pagedata[0].planTypeStatistics.planTypes.forEach((value, index, array) => { this.pagedata[0].planTypeStatistics.planTypes.forEach(
if (array[index].planTypeName == 'Plan2D') { (value, index, array) => {
this.twoPlanNum = array[index].count if (array[index].planTypeName == "Plan2D") {
} else if (array[index].planTypeName == 'Plan3D') { this.twoPlanNum = array[index].count;
this.threePlanNum = array[index].count } else if (array[index].planTypeName == "Plan3D") {
} else if (array[index].planTypeName == 'Other') { this.threePlanNum = array[index].count;
this.otherPlanNum = array[index].count } else if (array[index].planTypeName == "Other") {
} else if (array[index].planTypeName == 'PlanText') { this.otherPlanNum = array[index].count;
this.cardPlanNum = array[index].count } else if (array[index].planTypeName == "PlanText") {
this.cardPlanNum = array[index].count;
} }
}); }
);
} }
if (this.pagedata[0].planCategoryStatistics.planCategories.length <= 0) { if (this.pagedata[0].planCategoryStatistics.planCategories.length <= 0) {
this.aPlan = '0' this.aPlan = "0";
this.bPlan = '0' this.bPlan = "0";
this.cPlan = '0' this.cPlan = "0";
this.dPlan = '0' this.dPlan = "0";
this.ePlan = '0' this.ePlan = "0";
} else { } else {
this.pagedata[0].planCategoryStatistics.planCategories.forEach((value, index, array) => { this.pagedata[0].planCategoryStatistics.planCategories.forEach(
if (array[index].planCategoryName == 'LevelOne') { (value, index, array) => {
this.aPlan = array[index].count if (array[index].planCategoryName == "LevelOne") {
} else if (array[index].planCategoryName == 'LevelTwo') { this.aPlan = array[index].count;
this.bPlan = array[index].count } else if (array[index].planCategoryName == "LevelTwo") {
} else if (array[index].planCategoryName == 'LevelThree') { this.bPlan = array[index].count;
this.cPlan = array[index].count } else if (array[index].planCategoryName == "LevelThree") {
} else if (array[index].planCategoryName == 'LevelFour') { this.cPlan = array[index].count;
this.dPlan = array[index].count } else if (array[index].planCategoryName == "LevelFour") {
} else if (array[index].planCategoryName == 'LevelFive') { this.dPlan = array[index].count;
this.ePlan = array[index].count } else if (array[index].planCategoryName == "LevelFive") {
this.ePlan = array[index].count;
} }
});
} }
);
}
/* */ /* */
let planStateOptionsZhi = { let planStateOptionsZhi = {
title: { title: {
text: `预案状态统计（${this.pagedata[0].planStatusStatistics.totalCount}份）`, text: `预案状态统计（${this.pagedata[0].planStatusStatistics.totalCount}份）`,
left: 'left', left: "left",
textStyle: { textStyle: {
color: '#fff', color: "#fff",
fontWeight: 'normal' fontWeight: "normal",
} },
}, },
tooltip: { tooltip: {
trigger: 'item', trigger: "item",
formatter: '{b} : {c} ({d}%)' formatter: "{b} : {c} ({d}%)",
}, },
series: [ series: [
{ {
name: '访问来源', name: "访问来源",
type: 'pie', type: "pie",
radius: '60%', radius: "60%",
center: ['50%', '58%'], center: ["50%", "58%"],
label: { label: {
show: true, show: true,
//fontSize:10, //fontSize:10,
formatter: '{b}\n{d|{c}份}', formatter: "{b}\n{d|{c}份}",
rich: { rich: {
d: { d: {
align: 'center', align: "center",
} },
}, },
}, },
data: [ data: [
{ value: this.pagedata[0].planStatusStatistics.planStatuses[0] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[0].count : 0, name: '预案新增', type: 1, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[0] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[0].planStatusName : '' }, {
{ value: this.pagedata[0].planStatusStatistics.planStatuses[2] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[2].count : 0, name: '预案审核通过', type: 3, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[2] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[2].planStatusName : '' }, value:
{ value: this.pagedata[0].planStatusStatistics.planStatuses[4] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[4].count : 0, name: '预案编制', type: 5, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[4] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[4].planStatusName : '' }, this.pagedata[0].planStatusStatistics.planStatuses[0] !=
{ value: this.pagedata[0].planStatusStatistics.planStatuses[3] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[3].count : 0, name: '预案审核退回', type: 4, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[3] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[3].planStatusName : '' }, undefined
{ value: this.pagedata[0].planStatusStatistics.planStatuses[1] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[1].count : 0, name: '预案审核中', type: 2, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[1] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[1].planStatusName : '' } ? this.pagedata[0].planStatusStatistics.planStatuses[0].count
: 0,
name: "预案新增",
type: 1,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[0] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[0]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[2] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[2].count
: 0,
name: "预案审核通过",
type: 3,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[2] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[2]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[4] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[4].count
: 0,
name: "预案编制",
type: 5,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[4] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[4]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[3] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[3].count
: 0,
name: "预案审核退回",
type: 4,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[3] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[3]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[1] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[1].count
: 0,
name: "预案审核中",
type: 2,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[1] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[1]
.planStatusName
: "",
},
], ],
emphasis: { emphasis: {
itemStyle: { itemStyle: {
shadowBlur: 10, shadowBlur: 10,
shadowOffsetX: 0, shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)' shadowColor: "rgba(0, 0, 0, 0.5)",
} },
} },
} },
] ],
}; };
this.planState = echarts.init(document.getElementById('chartHynyxf'), 'walden'); this.planState = echarts.init(
document.getElementById("chartHynyxf"),
"walden"
);
this.planState.setOption(planStateOptionsZhi); this.planState.setOption(planStateOptionsZhi);
this.planState.on("click", (params) => { this.planState.on("click", (params) => {
this.router.navigate(['/statisticanalysis/statePageOne']) this.router.navigate(["/statisticanalysis/statePageOne"]);
}) });
} }
//新增、删除单位统计 //新增、删除单位统计
chartDwsjcj chartDwsjcj;
addtable addtable;
addxdata = [] addxdata = [];
addydata = [] addydata = [];
chartDwsjcjOptionsZhong = { chartDwsjcjOptionsZhong = {
// color: ['#FB33C2', '#00CFF0', '#2C3DE0'], // color: ['#FB33C2', '#00CFF0', '#2C3DE0'],
// 标题 // 标题
title: { title: {
text: '新增、删除单位统计', text: "新增、删除单位统计",
left: 0, left: 0,
top: 0, top: 0,
textStyle: { textStyle: {
color: '#fff', color: "#fff",
fontWeight: 'normal' fontWeight: "normal",
}, },
}, },
grid: { grid: {
@ -291,18 +371,33 @@ export class HomeComponent implements OnInit {
//图例 //图例
legend: { legend: {
top: 0, top: 0,
data: ['新增单位', '删除单位',], data: ["新增单位", "删除单位"],
icon: 'circle', icon: "circle",
itemGap: 20, itemGap: 20,
}, },
//提示框 //提示框
tooltip: { tooltip: {
trigger: 'axis', trigger: "axis",
}, },
// x轴 // x轴
xAxis: { xAxis: {
type: 'category', type: "category",
data: ["浦东中队", "黄浦中队", "徐汇中队", "长宁中队", "静安中队", "普陀中队", "虹口中队", "杨浦中队", "闵行中队", "宝山中队", "嘉定中队", "松江中队", "金山中队", "崇明中队"], data: [
"浦东中队",
"黄浦中队",
"徐汇中队",
"长宁中队",
"静安中队",
"普陀中队",
"虹口中队",
"杨浦中队",
"闵行中队",
"宝山中队",
"嘉定中队",
"松江中队",
"金山中队",
"崇明中队",
],
axisLabel: { axisLabel: {
interval: 0, interval: 0,
@ -311,7 +406,8 @@ export class HomeComponent implements OnInit {
var maxLength = 5; //每项显示文字个数 var maxLength = 5; //每项显示文字个数
var valLength = value.length; //X轴类目项的文字个数 var valLength = value.length; //X轴类目项的文字个数
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数 var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
if (rowN > 1) { //如果类目项的文字大于3, if (rowN > 1) {
//如果类目项的文字大于3,
for (var i = 0; i < rowN; i++) { for (var i = 0; i < rowN; i++) {
var temp = ""; //每次截取的字符串 var temp = ""; //每次截取的字符串
var start = i * maxLength; //开始截取的位置 var start = i * maxLength; //开始截取的位置
@ -324,56 +420,60 @@ export class HomeComponent implements OnInit {
} else { } else {
return value; return value;
} }
} //function }, //function
},
}
}, },
// y轴 // y轴
yAxis: { yAxis: {
type: 'value', type: "value",
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: 'rgba(255,255,255,.4)' color: "rgba(255,255,255,.4)",
} },
}, },
}, },
// 数据 // 数据
series: [ series: [
{ {
name: '新增单位', name: "新增单位",
type: 'bar', type: "bar",
data: [88, 45, 95, 105, 75, 89, 69, 110, 96, 90, 80, 78, 94, 102], data: [88, 45, 95, 105, 75, 89, 69, 110, 96, 90, 80, 78, 94, 102],
label: { label: {
show: false, show: false,
position: "top", position: "top",
formatter: '{c}', formatter: "{c}",
color: "#fff", color: "#fff",
} },
}, { },
name: '删除单位', {
type: 'bar', name: "删除单位",
type: "bar",
data: [35, 33, 27, 30, 35, 36, 28, 32, 36, 22, 19, 28, 34, 36], data: [35, 33, 27, 30, 35, 36, 28, 32, 36, 22, 19, 28, 34, 36],
label: { label: {
show: false, show: false,
position: "top", position: "top",
formatter: '{c}', formatter: "{c}",
color: "#fff", color: "#fff",
} },
} },
], ],
}; };
unitData() { unitData() {
this.addxdata = [] this.addxdata = [];
this.addydata = [] this.addydata = [];
this.addtable = JSON.parse(JSON.stringify(this.emitService.allDate)) this.addtable = JSON.parse(JSON.stringify(this.emitService.allDate));
this.addtable[0].organizationStatistics.organizations.forEach((value, index, array) => { this.addtable[0].organizationStatistics.organizations.forEach(
if (array[index].organizationId != '5687316efa75479d96c0091a167a3b84' && array[index].organizationName != '上海总队') { (value, index, array) => {
this.addxdata.push(array[index].organizationName) if (
this.addydata.push(array[index].count) array[index].organizationId != "5687316efa75479d96c0091a167a3b84" &&
} array[index].organizationName != "上海总队"
) {
}); this.addxdata.push(array[index].organizationName);
this.addydata.push(array[index].count);
}
}
);
let chartDwsjcjOptionsZhi = { let chartDwsjcjOptionsZhi = {
// 标题 // 标题
title: { title: {
@ -381,15 +481,15 @@ export class HomeComponent implements OnInit {
left: 0, left: 0,
top: 0, top: 0,
textStyle: { textStyle: {
color: '#fff', color: "#fff",
fontWeight: 'normal' fontWeight: "normal",
}, },
}, },
grid: { grid: {
//containLabel:true, //containLabel:true,
left: 30, left: 30,
right: 0, right: 0,
bottom: 30 bottom: 30,
}, },
//图例 //图例
/* legend: { /* legend: {
@ -400,11 +500,11 @@ export class HomeComponent implements OnInit {
}, */ }, */
//提示框 //提示框
tooltip: { tooltip: {
trigger: 'axis', trigger: "axis",
}, },
// x轴 // x轴
xAxis: { xAxis: {
type: 'category', type: "category",
data: this.addxdata, data: this.addxdata,
axisLabel: { axisLabel: {
interval: 0, interval: 0,
@ -414,7 +514,8 @@ export class HomeComponent implements OnInit {
var maxLength = 5; //每项显示文字个数 var maxLength = 5; //每项显示文字个数
var valLength = value.length; //X轴类目项的文字个数 var valLength = value.length; //X轴类目项的文字个数
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数 var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
if (rowN > 1) { //如果类目项的文字大于3, if (rowN > 1) {
//如果类目项的文字大于3,
for (var i = 0; i < rowN; i++) { for (var i = 0; i < rowN; i++) {
var temp = ""; //每次截取的字符串 var temp = ""; //每次截取的字符串
var start = i * maxLength; //开始截取的位置 var start = i * maxLength; //开始截取的位置
@ -427,34 +528,33 @@ export class HomeComponent implements OnInit {
} else { } else {
return value; return value;
} }
} //function }, //function
},
}
}, },
// y轴 // y轴
yAxis: { yAxis: {
type: 'value', type: "value",
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: 'rgba(255,255,255,.4)' color: "rgba(255,255,255,.4)",
} },
}, },
}, },
// 数据 // 数据
series: [ series: [
{ {
name: '新增单位', name: "新增单位",
type: 'bar', type: "bar",
data: this.addydata, data: this.addydata,
label: { label: {
show: false, show: false,
position: "top", position: "top",
formatter: '{c}', formatter: "{c}",
color: "#fff", color: "#fff",
}, },
barMaxWidth: '20%' barMaxWidth: "20%",
} },
/* , { /* , {
name: '删除单位', name: '删除单位',
type: 'bar', type: 'bar',
@ -468,41 +568,48 @@ export class HomeComponent implements OnInit {
} */ } */
], ],
}; };
this.chartDwsjcj = echarts.init(document.getElementById('chartDwsjcj'), 'walden'); this.chartDwsjcj = echarts.init(
document.getElementById("chartDwsjcj"),
"walden"
);
this.chartDwsjcj.setOption(chartDwsjcjOptionsZhi); this.chartDwsjcj.setOption(chartDwsjcjOptionsZhi);
this.chartDwsjcj.on("click", (params) => { this.chartDwsjcj.on("click", (params) => {
this.router.navigate(['/statisticanalysis/addUnit_one']) this.router.navigate(["/statisticanalysis/addUnit_one"]);
}) });
} }
chartZdgzqy chartZdgzqy;
//建筑类型统计 //建筑类型统计
keyUnit() { keyUnit() {
this.buildcount = 0 this.buildcount = 0;
this.buildtableData = JSON.parse(JSON.stringify(this.emitService.allDate)) this.buildtableData = JSON.parse(JSON.stringify(this.emitService.allDate));
//console.log(this.buildtableData) //console.log(this.buildtableData)
for (var i = 0; i < this.buildtableData[0].buildingTypes.length; i++) { for (var i = 0; i < this.buildtableData[0].buildingTypes.length; i++) {
this.lengthdata.push(this.buildtableData[0].buildingTypes[i].buildingTypeName) this.lengthdata.push(
this.buildcount = this.buildcount + this.buildtableData[0].buildingTypes[i].count this.buildtableData[0].buildingTypes[i].buildingTypeName
this.indexData.push(this.buildtableData[0].buildingTypes[i]) );
this.buildcount =
this.buildcount + this.buildtableData[0].buildingTypes[i].count;
this.indexData.push(this.buildtableData[0].buildingTypes[i]);
} }
//JSON.parse(JSON.stringify(this.indexData).replace(/buildingTypeName/g, 'name')) //JSON.parse(JSON.stringify(this.indexData).replace(/buildingTypeName/g, 'name'))
this.indexData = this.indexData.map(v => { return { name: v.buildingTypeName, value: v.count, id: v.buildingTypeId } }) this.indexData = this.indexData.map((v) => {
return { name: v.buildingTypeName, value: v.count, id: v.buildingTypeId };
});
let chartZdgzqyOptionsZhi = { let chartZdgzqyOptionsZhi = {
title: { title: {
text: `建筑类型统计（${this.buildcount}家）`, text: `建筑类型统计（${this.buildcount}家）`,
top: -5, top: -5,
left: 'left', left: "left",
textStyle: { textStyle: {
color: '#fff', color: "#fff",
fontWeight: 'normal' fontWeight: "normal",
} },
}, },
tooltip: { tooltip: {
trigger: 'item', trigger: "item",
formatter: '{b} : {c}家 ({d}%)' formatter: "{b} : {c}家 ({d}%)",
}, },
// legend: { // legend: {
// orient: 'vertical', // orient: 'vertical',
@ -512,18 +619,18 @@ export class HomeComponent implements OnInit {
// }, // },
series: [ series: [
{ {
name: '访问来源', name: "访问来源",
type: 'pie', type: "pie",
radius: '70%', radius: "70%",
center: ['50%', '61%'], center: ["50%", "61%"],
label: { label: {
show: true, show: true,
// fontSize:13, // fontSize:13,
formatter: '{b}{c}家', formatter: "{b}{c}家",
rich: { rich: {
d: { d: {
align: 'center', align: "center",
} },
}, },
}, },
data: this.indexData, data: this.indexData,
@ -531,21 +638,24 @@ export class HomeComponent implements OnInit {
itemStyle: { itemStyle: {
shadowBlur: 10, shadowBlur: 10,
shadowOffsetX: 0, shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)' shadowColor: "rgba(0, 0, 0, 0.5)",
} },
} },
} },
] ],
}; };
this.chartZdgzqy = echarts.init(document.getElementById('chartZdgzqy'), 'walden'); this.chartZdgzqy = echarts.init(
document.getElementById("chartZdgzqy"),
"walden"
);
this.chartZdgzqy.setOption(chartZdgzqyOptionsZhi); this.chartZdgzqy.setOption(chartZdgzqyOptionsZhi);
this.chartZdgzqy.on("click", (params) => { this.chartZdgzqy.on("click", (params) => {
this.router.navigate(['/statisticanalysis/buildingType_one']) this.router.navigate(["/statisticanalysis/buildingType_one"]);
}) });
} }
isNumList: boolean = true isNumList: boolean = true;
changeNumList() { changeNumList() {
this.isNumList = !this.isNumList this.isNumList = !this.isNumList;
} }
} }

4
src/index.html
Unescape View File

@ -27,9 +27,9 @@
<!-- <script <!-- <script
src="http://10.81.73.39:8000/webapi/maps?v=2.0&key=2584e43582b85680d76a515979503538&plugin=AMap.Driving,AMap.MouseTool,AMap.RangingTool"></script> src="http://10.81.73.39:8000/webapi/maps?v=2.0&key=2584e43582b85680d76a515979503538&plugin=AMap.Driving,AMap.MouseTool,AMap.RangingTool"></script>
<script src="http://10.81.73.39:8000/webapi/ui/1.1/main.js"></script> --> <script src="http://10.81.73.39:8000/webapi/ui/1.1/main.js"></script> -->
<!-- <script <script
src="https://webapi.amap.com/maps?v=2.0&key=2584e43582b85680d76a515979503538&plugin=AMap.Driving,AMap.MouseTool,AMap.RangingTool"></script> src="https://webapi.amap.com/maps?v=2.0&key=2584e43582b85680d76a515979503538&plugin=AMap.Driving,AMap.MouseTool,AMap.RangingTool"></script>
<script src="https://webapi.amap.com/ui/1.1/main.js"></script> --> <script src="https://webapi.amap.com/ui/1.1/main.js"></script>
<script src="/assets/html2canvas.js"></script> <script src="/assets/html2canvas.js"></script>
<script type="text/javascript" src="/assets/wordexport/jquery.js"></script> <script type="text/javascript" src="/assets/wordexport/jquery.js"></script>
<script type="text/javascript" src="/assets/wordexport/FileSaver.js"></script> <script type="text/javascript" src="/assets/wordexport/FileSaver.js"></script>

Write Preview
Loading…
Cancel
Save