Browse Source

修复 回调函数中 this指向问题.

上海一张图
赵旭 4 years ago
parent
commit
c701c4a275
  1. 246
      src/app/statistic-analysis/home/home.component.ts
  2. 34
      src/modules/map/declare/gaode-map.ts

246
src/app/statistic-analysis/home/home.component.ts

@ -13,18 +13,18 @@ declare var echarts: any;
})
export class HomeComponent implements OnInit {
constructor(private http:HttpClient, private render2: Renderer2,public element: ElementRef,private router: Router,public emitService: EchartsDataService) { }
constructor(private http: HttpClient, private render2: Renderer2, public element: ElementRef, private router: Router, public emitService: EchartsDataService) { }
map:IMap; //地图
map: IMap; //地图
yuandata
ngOnInit() {
this.getechartsdata()
window.setTimeout(()=>{
window.setTimeout(() => {
/* this.unitType()
this.unitData()
this.keyUnit() */
this.mapInit() //初始化地图
},0)
}, 0)
}
//更新echarts视图
@ -37,44 +37,44 @@ export class HomeComponent implements OnInit {
//获取数据
ordata
buildtableData
lengthdata=[]//建筑提示数据
buildcount=0//建筑总数
indexData=[]//建筑所有数据
async getechartsdata(){
let paramsdata:any = {
OrganizationId:this.orid||'',
lengthdata = []//建筑提示数据
buildcount = 0//建筑总数
indexData = []//建筑所有数据
async getechartsdata() {
let paramsdata: any = {
OrganizationId: this.orid || '',
//organizationId:'1'
}
//获取组织机构数据
await this.emitService.getData(paramsdata,`/api/StatisticsAnalysis/Companies`)
this.ordata=JSON.parse(JSON.stringify(this.emitService.allDate))
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Companies`)
this.ordata = JSON.parse(JSON.stringify(this.emitService.allDate))
console.log(this.ordata)
this.keyUnitNum=this.ordata[0].organizationStatistics.totalCount
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()
//获取建筑类型统计数据
await this.emitService.getData(paramsdata,`/api/StatisticsAnalysis/BuildingTypes`)
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/BuildingTypes`)
this.keyUnit()
}
threePlan(){
threePlan() {
// this.router.navigate(['/planManagement/entryPlan'])
}
twoPlan(){
twoPlan() {
// this.router.navigate(['/planManagement/entryPlan'])
}
cardPlan(){
cardPlan() {
// this.router.navigate(['/planManagement/entryPlan'])
}
otherPlan(){
otherPlan() {
// this.router.navigate(['/planManagement/entryPlan'])
}
//计划更新页面跳转
scheduled(){
scheduled() {
this.router.navigate(['/statisticanalysis/scheduledUpdates'])
}
@ -88,38 +88,38 @@ export class HomeComponent implements OnInit {
}
//初始化地图
adcode:any //行政编码
adcode: any //行政编码
level = sessionStorage.getItem("level")//组织级别
orid
//封装Gaode
getEchartsData (data) {
return new Promise((resolve, reject)=>{
let paramsdata:any ={
name:data.properties.name,
level:Number(this.level)+1
}
this.http.get("/api/Organizations/GetIdByName",{params:paramsdata}).subscribe((data:any)=>{
this.orid=data[0]
getEchartsData(data) {
return new Promise((resolve, reject) => {
let paramsdata: any = {
name: data.properties.name,
level: Number(this.level) + 1
}
this.http.get("/api/Organizations/GetIdByName", { params: paramsdata }).subscribe((data: any) => {
this.orid = data[0]
this.getechartsdata()
resolve('success')
})
})
}
setEchartsData () {
this.orid=''
setEchartsData() {
this.orid = ''
this.getechartsdata()
}
//封装Gaode
mapInit () {
mapInit() {
//创建地图
this.map = MapFactory.MapInstance('chartMap', {
cursor: 'default',
zooms:[8,16],
mapStyle:"amap://styles/grey",
zooms: [8, 16],
mapStyle: "amap://styles/grey",
});
this.map.setAdministrativeAreaStyle(this,this.getEchartsData,this.setEchartsData)
this.map.setAdministrativeAreaStyle(this, this.getEchartsData, this.setEchartsData)
}
planNum = []
keyUnitNum
@ -145,51 +145,51 @@ export class HomeComponent implements OnInit {
//预案状态统计
pagedata
pagedataCount
unitType () {
this.planNum=[]
this.pagedata=JSON.parse(JSON.stringify(this.emitService.allDate))
unitType() {
this.planNum = []
this.pagedata = JSON.parse(JSON.stringify(this.emitService.allDate))
console.log(this.pagedata)
this.pagedataCount=String(this.pagedata[0].planStatusStatistics.totalCount)
for(var i=0;i<this.pagedataCount.length;i++){
this.pagedataCount = String(this.pagedata[0].planStatusStatistics.totalCount)
for (var i = 0; i < this.pagedataCount.length; i++) {
this.planNum.push(this.pagedataCount[i])
}
//this.planNum.push(this.pagedataCount.split(','))
if(this.pagedata[0].planTypeStatistics.planTypes.length<=0){
this.threePlanNum='0'
this.twoPlanNum='0'
this.cardPlanNum='0'
this.otherPlanNum='0'
}else{
this.pagedata[0].planTypeStatistics.planTypes.forEach((value,index,array) => {
if(array[index].planTypeName=='Plan2D'){
this.twoPlanNum=array[index].count
}else if(array[index].planTypeName=='Plan3D'){
this.threePlanNum=array[index].count
}else if(array[index].planTypeName=='Other'){
this.otherPlanNum=array[index].count
}else if(array[index].planTypeName=='PlanText'){
this.cardPlanNum=array[index].count
if (this.pagedata[0].planTypeStatistics.planTypes.length <= 0) {
this.threePlanNum = '0'
this.twoPlanNum = '0'
this.cardPlanNum = '0'
this.otherPlanNum = '0'
} else {
this.pagedata[0].planTypeStatistics.planTypes.forEach((value, index, array) => {
if (array[index].planTypeName == 'Plan2D') {
this.twoPlanNum = array[index].count
} else if (array[index].planTypeName == 'Plan3D') {
this.threePlanNum = array[index].count
} else if (array[index].planTypeName == 'Other') {
this.otherPlanNum = array[index].count
} else if (array[index].planTypeName == 'PlanText') {
this.cardPlanNum = array[index].count
}
});
}
if(this.pagedata[0].planCategoryStatistics.planCategories.length<=0){
this.aPlan='0'
this.bPlan='0'
this.cPlan='0'
this.dPlan='0'
this.ePlan='0'
}else{
this.pagedata[0].planCategoryStatistics.planCategories.forEach((value,index,array) => {
if(array[index].planCategoryName=='LevelOne'){
this.aPlan=array[index].count
}else if(array[index].planCategoryName=='LevelTwo'){
this.bPlan=array[index].count
}else if(array[index].planCategoryName=='LevelThree'){
this.cPlan=array[index].count
}else if(array[index].planCategoryName=='LevelFour'){
this.dPlan=array[index].count
}else if(array[index].planCategoryName=='LevelFive'){
this.ePlan=array[index].count
if (this.pagedata[0].planCategoryStatistics.planCategories.length <= 0) {
this.aPlan = '0'
this.bPlan = '0'
this.cPlan = '0'
this.dPlan = '0'
this.ePlan = '0'
} else {
this.pagedata[0].planCategoryStatistics.planCategories.forEach((value, index, array) => {
if (array[index].planCategoryName == 'LevelOne') {
this.aPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelTwo') {
this.bPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelThree') {
this.cPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelFour') {
this.dPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelFive') {
this.ePlan = array[index].count
}
});
}
@ -200,9 +200,9 @@ export class HomeComponent implements OnInit {
title: {
text: `预案状态统计(${this.pagedata[0].planStatusStatistics.totalCount}份)`,
left: 'left',
textStyle:{
color:'#fff',
fontWeight:'normal'
textStyle: {
color: '#fff',
fontWeight: 'normal'
}
},
tooltip: {
@ -215,10 +215,10 @@ export class HomeComponent implements OnInit {
type: 'pie',
radius: '60%',
center: ['50%', '58%'],
label:{
show:true,
label: {
show: true,
//fontSize:10,
formatter:'{b}\n{d|{c}份}',
formatter: '{b}\n{d|{c}份}',
rich: {
d: {
align: 'center',
@ -227,11 +227,11 @@ export class HomeComponent implements OnInit {
},
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: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:''}
{ 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: 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: {
itemStyle: {
@ -245,7 +245,7 @@ export class HomeComponent implements OnInit {
};
this.planState = echarts.init(document.getElementById('chartHynyxf'), 'walden');
this.planState.setOption(planStateOptionsZhi);
this.planState.on("click",(params) => {
this.planState.on("click", (params) => {
this.router.navigate(['/statisticanalysis/statePageOne'])
})
}
@ -253,8 +253,8 @@ export class HomeComponent implements OnInit {
//新增、删除单位统计
chartDwsjcj
addtable
addxdata=[]
addydata=[]
addxdata = []
addydata = []
chartDwsjcjOptionsZhong = {
// color: ['#FB33C2', '#00CFF0', '#2C3DE0'],
// 标题
@ -262,9 +262,9 @@ export class HomeComponent implements OnInit {
text: '新增、删除单位统计',
left: 0,
top: 0,
textStyle:{
color:'#fff',
fontWeight:'normal'
textStyle: {
color: '#fff',
fontWeight: 'normal'
},
},
grid: {
@ -274,7 +274,7 @@ export class HomeComponent implements OnInit {
//图例
legend: {
top: 0,
data: ['新增单位', '删除单位', ],
data: ['新增单位', '删除单位',],
icon: 'circle',
itemGap: 20,
},
@ -285,11 +285,11 @@ export class HomeComponent implements OnInit {
// x轴
xAxis: {
type: 'category',
data: ["浦东中队","黄浦中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队","松江中队","金山中队","崇明中队"],
data: ["浦东中队", "黄浦中队", "徐汇中队", "长宁中队", "静安中队", "普陀中队", "虹口中队", "杨浦中队", "闵行中队", "宝山中队", "嘉定中队", "松江中队", "金山中队", "崇明中队"],
axisLabel: {
interval: 0,
formatter:function(value){
formatter: function (value) {
var ret = "";//拼接加\n返回的类目项
var maxLength = 5;//每项显示文字个数
var valLength = value.length;//X轴类目项的文字个数
@ -304,7 +304,7 @@ export class HomeComponent implements OnInit {
ret += temp;
} //凭借最终的字符串
return ret;
}else {
} else {
return value;
}
} //function
@ -346,11 +346,11 @@ export class HomeComponent implements OnInit {
}
],
};
unitData () {
this.addxdata=[]
this.addydata=[]
this.addtable=JSON.parse(JSON.stringify(this.emitService.allDate))
this.addtable[0].organizationStatistics.organizations.forEach((value,index,array) => {
unitData() {
this.addxdata = []
this.addydata = []
this.addtable = JSON.parse(JSON.stringify(this.emitService.allDate))
this.addtable[0].organizationStatistics.organizations.forEach((value, index, array) => {
this.addxdata.push(array[index].organizationName)
this.addydata.push(array[index].count)
});
@ -360,16 +360,16 @@ export class HomeComponent implements OnInit {
text: `新增单位统计(${this.addtable[0].totalCount}家)`,
left: 0,
top: 0,
textStyle:{
color:'#fff',
fontWeight:'normal'
textStyle: {
color: '#fff',
fontWeight: 'normal'
},
},
grid: {
//containLabel:true,
left: 30,
right: 0,
bottom:30
bottom: 30
},
//图例
/* legend: {
@ -389,7 +389,7 @@ export class HomeComponent implements OnInit {
axisLabel: {
interval: 0,
formatter:function(value){
formatter: function (value) {
var ret = "";//拼接加\n返回的类目项
var maxLength = 5;//每项显示文字个数
var valLength = value.length;//X轴类目项的文字个数
@ -404,7 +404,7 @@ export class HomeComponent implements OnInit {
ret += temp;
} //凭借最终的字符串
return ret;
}else {
} else {
return value;
}
} //function
@ -433,7 +433,7 @@ export class HomeComponent implements OnInit {
formatter: '{c}',
color: "#fff",
},
barMaxWidth:'20%'
barMaxWidth: '20%'
}
/* , {
name: '删除单位',
@ -448,9 +448,9 @@ 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.on("click",(params) => {
this.chartDwsjcj.on("click", (params) => {
this.router.navigate(['/statisticanalysis/addUnit_one'])
})
}
@ -459,25 +459,25 @@ export class HomeComponent implements OnInit {
//建筑类型统计
keyUnit () {
this.buildcount=0
this.buildtableData=JSON.parse(JSON.stringify(this.emitService.allDate))
keyUnit() {
this.buildcount = 0
this.buildtableData = JSON.parse(JSON.stringify(this.emitService.allDate))
//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.buildcount=this.buildcount+this.buildtableData[0].buildingTypes[i].count
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'))
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 = {
title: {
text: `建筑类型统计(${this.buildcount}家)`,
top: -5,
left: 'left',
textStyle:{
color:'#fff',
fontWeight:'normal'
textStyle: {
color: '#fff',
fontWeight: 'normal'
}
},
tooltip: {
@ -496,10 +496,10 @@ export class HomeComponent implements OnInit {
type: 'pie',
radius: '70%',
center: ['50%', '61%'],
label:{
show:true,
label: {
show: true,
// fontSize:13,
formatter:'{b}{c}家',
formatter: '{b}{c}家',
rich: {
d: {
align: 'center',
@ -519,13 +519,13 @@ export class HomeComponent implements OnInit {
};
this.chartZdgzqy = echarts.init(document.getElementById('chartZdgzqy'), 'walden');
this.chartZdgzqy.setOption(chartZdgzqyOptionsZhi);
this.chartZdgzqy.on("click",(params) => {
this.chartZdgzqy.on("click", (params) => {
this.router.navigate(['/statisticanalysis/buildingType_one'])
})
}
isNumList:boolean = true
changeNumList(){
isNumList: boolean = true
changeNumList() {
this.isNumList = !this.isNumList
}
}

34
src/modules/map/declare/gaode-map.ts

@ -14,7 +14,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
this.self = new AMap.Map(container, options);
}
setBounds(zoom?: any, x?: any, y?: any, is?: boolean) {
return this.self.setBounds(zoom,x,y,is)
return this.self.setBounds(zoom, x, y, is)
}
setFitView(options: any) {
return this.self.setFitView(options)
@ -52,7 +52,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
setZoom(zoom) {
return this.self.setZoom(zoom)
}
setCenter(pos:any) {
setCenter(pos: any) {
return this.self.setCenter(pos)
}
getCenter() {
@ -64,10 +64,10 @@ export class GaoDeMap extends GaodeBasic implements IMap {
on(eventName: string, callback: Function): void {
return this.self.on(eventName, callback);
}
setAdministrativeAreaStyle(component:any,getData?:Function, setData?:Function) {//自定义 行政区划 样式
setAdministrativeAreaStyle(component: any, getData?: Function, setData?: Function) {//自定义 行政区划 样式
let that = this
let level = sessionStorage.getItem("level")
AMapUI.loadUI(['geo/DistrictExplorer'], (DistrictExplorer)=> {
AMapUI.loadUI(['geo/DistrictExplorer'], (DistrictExplorer) => {
let colors = [
"#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00",
@ -82,7 +82,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
});
let adcode = 310000 //上海行政编码
districtExplorer.loadAreaNode(adcode, (error, areaNode)=> {
districtExplorer.loadAreaNode(adcode, (error, areaNode) => {
//更新地图视野
that.setBounds(areaNode.getBounds(), null, null, true);
@ -95,7 +95,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
districtExplorer.clearFeaturePolygons();
//绘制子区域
districtExplorer.renderSubFeatures(areaNode, (feature, i) =>{
districtExplorer.renderSubFeatures(areaNode, (feature, i) => {
let fillColor = colors[i % colors.length];
let strokeColor = colors[colors.length - 1 - i % colors.length];
return {
@ -124,20 +124,20 @@ export class GaoDeMap extends GaodeBasic implements IMap {
that.setFitView(districtExplorer.getAllFeaturePolygons());
});
if(level=="0"||level=="1"||level=="2"){
if (level == "0" || level == "1" || level == "2") {
//区域内点击
districtExplorer.on('featureClick', (e, feature) =>{
getData && getData(feature);
districtExplorer.on('featureClick', (e, feature) => {
getData && getData.call(component, feature);
let props = feature.properties;
adcode = props.adcode
let fillColor2
if(props.level == 'city'){
if (props.level == 'city') {
fillColor2 = null
}else{
} else {
fillColor2 = '#d0daee'
}
districtExplorer.loadAreaNode(adcode, (error, areaNode)=> {
districtExplorer.loadAreaNode(adcode, (error, areaNode) => {
//设置定位节点,支持鼠标位置识别
//注意节点的顺序,前面的高优先级
@ -147,7 +147,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
districtExplorer.clearFeaturePolygons();
//绘制子区域
districtExplorer.renderSubFeatures(areaNode, (feature, i) =>{
districtExplorer.renderSubFeatures(areaNode, (feature, i) => {
let fillColor = colors[i % colors.length];
let strokeColor = colors[colors.length - 1 - i % colors.length];
return {
@ -178,9 +178,9 @@ export class GaoDeMap extends GaodeBasic implements IMap {
});
districtExplorer.on('outsideClick', (e) => {
setData && setData(component);
setData && setData.call(component);
let adcode = 310000
districtExplorer.loadAreaNode(adcode, (error, areaNode)=> {
districtExplorer.loadAreaNode(adcode, (error, areaNode) => {
//设置定位节点,支持鼠标位置识别
//注意节点的顺序,前面的高优先级
@ -190,7 +190,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
districtExplorer.clearFeaturePolygons();
//绘制子区域
districtExplorer.renderSubFeatures(areaNode, (feature, i) =>{
districtExplorer.renderSubFeatures(areaNode, (feature, i) => {
let fillColor = colors[i % colors.length];
let strokeColor = colors[colors.length - 1 - i % colors.length];
return {
@ -360,7 +360,7 @@ export class GaodePlaceSearch extends GaodeBasic implements IPlaceSearch {
this.self = new AMap.PlaceSearch()
}
search(text: string, callback: Function) {
return this.self.search(text,callback)
return this.self.search(text, callback)
}
}

Loading…
Cancel
Save