From c338b90c3dad1549ddc1eac1d1e2641dc8d332fd Mon Sep 17 00:00:00 2001
From: fengxiang <110431245@qq.com>
Date: Mon, 13 Aug 2018 15:44:44 +0800
Subject: [PATCH] 地图增加 网格
---
src/app/routes/forecasting-warning/forecasting-warning.component.html | 11 ++++-
src/app/routes/forecasting-warning/forecasting-warning.component.ts | 2
src/app/routes/sand-table/sand-table.component.ts | 2
src/environments/environment.ts | 2
src/app/routes/grid-trace/grid-trace.component.ts | 62 ++++++++++++++++++++++++++++---
src/assets/app-data.json | 31 ++-------------
.angular-cli.json | 4 +
src/app/routes/home-page/home-page/home-page.component.html | 2
src/app/routes/sand-table/sand-table.component.html | 3 +
9 files changed, 80 insertions(+), 39 deletions(-)
diff --git a/.angular-cli.json b/.angular-cli.json
index b30914a..1eb8118 100644
--- a/.angular-cli.json
+++ b/.angular-cli.json
@@ -24,7 +24,9 @@
"../node_modules/@antv/g2/dist/g2.min.js",
"../node_modules/@antv/data-set/dist/data-set.min.js",
"../node_modules/@antv/g2-plugin-slider/dist/g2-plugin-slider.min.js",
- "../node_modules/echarts/dist/echarts.min.js"
+ "../node_modules/echarts/dist/echarts.min.js",
+ "../node_modules/echarts/map/js/china.js",
+ "../node_modules/echarts/dist/extension/bmap.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
diff --git a/src/app/routes/forecasting-warning/forecasting-warning.component.html b/src/app/routes/forecasting-warning/forecasting-warning.component.html
index 9a1b2ee..0d8da6a 100644
--- a/src/app/routes/forecasting-warning/forecasting-warning.component.html
+++ b/src/app/routes/forecasting-warning/forecasting-warning.component.html
@@ -31,5 +31,12 @@
<!-- 15��� -->
<div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_temp_day" style="height: 300px; width: 100%"></div></div>
<!-- <div nz-col [nzSpan]="12"><div id="forecasting_uvi" style="height: 300px; width: 100%"></div></div> -->
-
-</div>
+ <br/>
+ <br/>
+ <br/>
+ <br/>
+ <br/>
+ <br/>
+ <br/>
+ <br/>
+</div>
\ No newline at end of file
diff --git a/src/app/routes/forecasting-warning/forecasting-warning.component.ts b/src/app/routes/forecasting-warning/forecasting-warning.component.ts
index 2e44734..0d07618 100644
--- a/src/app/routes/forecasting-warning/forecasting-warning.component.ts
+++ b/src/app/routes/forecasting-warning/forecasting-warning.component.ts
@@ -8,7 +8,7 @@
@Component({
selector: 'app-forecasting-warning',
- templateUrl: './forecasting-warning.component.html',
+ templateUrl: './forecasting-warning.component.html'
})
export class ForecastingWarningComponent implements OnInit {
diff --git a/src/app/routes/grid-trace/grid-trace.component.ts b/src/app/routes/grid-trace/grid-trace.component.ts
index 3d17648..5180555 100644
--- a/src/app/routes/grid-trace/grid-trace.component.ts
+++ b/src/app/routes/grid-trace/grid-trace.component.ts
@@ -1,8 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { _HttpClient } from '@delon/theme';
import { MapOptions, HeatmapData, HeatmapOptions, NavigationControlOptions, ControlAnchor, NavigationControlType } from 'angular2-baidu-map';
-import { ViewEncapsulation } from '@angular/compiler/src/core';
-import { BMapLib } from 'angular2-baidu-map/types/BMapLib';
@Component({
selector: 'app-grid-trace',
@@ -16,26 +14,32 @@
) {
this.options = {
minZoom: 3,
- maxZoom: 13,
+ maxZoom: 20,
cursor: 'default',
centerAndZoom: {
lng: 121,
lat: 31.4,
- zoom: 17
+ zoom: 15
},
enableKeyboard: true
};
}
loadMap(map: any) {
this._map = map;
+ this.showGrid();
+ this._map.addEventListener(
+ 'tilesloaded', () => {
+ this.showGrid();
+ }
+ )
}
navigationOpts: NavigationControlOptions;
//���������
heatData: HeatmapData = {
data: [
{"lng":121,"lat":31.4,"count":99},
- {"lng":121.02,"lat":31.38,"count":95},
- {"lng":120.96,"lat":31.39,"count":95},
+ {"lng":120.99,"lat":31.399,"count":95},
+ {"lng":121.002,"lat":31.392,"count":80},
],
max: 100
};
@@ -55,4 +59,50 @@
type: NavigationControlType.BMAP_NAVIGATION_CONTROL_LARGE
};
}
+ //map���������������
+ // TODO ������
+ bs() {
+ var bs = this._map.getBounds(); //������������������������������������
+ // var bssw = bs.getSouthWest(); //���������������������������(������������)
+ // var bsne = bs.getNorthEast(); //���������������������������(������������)
+ return { 'x1': bs.Ol.lng, 'y1': bs.Ol.lat, 'x2': bs.xl.lng, 'y2': bs.xl.lat };
+ }
+ /**
+ * ������������
+ */
+ // TODO ������
+ private showGridPolygons = [];
+ showGrid(){
+ const XY = this.bs();
+ console.log(XY);
+ let polygons = [];
+ for (let i = XY.x1; i < XY.x2; i = i + 0.0063) {
+ for (let j = XY.y2; j > XY.y1; j = j - 0.0048) {
+ //���������������������������������������������������:������������������Point���������������������������,���������������������������,���������������������������,���������������������������������������������������������������������������������������������������������������,������������������������������������������������������������������
+ const polygon = new window.BMap.Polygon([
+ new window.BMap.Point(i, j), //������������������
+ new window.BMap.Point(i, j-0.0048), //������������������
+ new window.BMap.Point(i+0.0063, j-0.0048), //������������������
+ new window.BMap.Point(i+0.0063, j) //������������������
+ ], {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5, fillOpacity:0.1});
+ // polygon .addEventListener("click",function clickFunction(){
+ // alert("������������������");
+ // });
+ // _map.addOverlay(polygon);
+ polygons.push(polygon);
+ }
+ }
+ if(!!this.showGridPolygons && this.showGridPolygons.length > 0){
+ this.showGridPolygons.forEach(
+ polygon => {
+ this._map.removeOverlay(polygon);
+ }
+ );
+ }
+ // this._map.addOverlays(polygons);
+ polygons.forEach(polygon=>{
+ this._map.addOverlay(polygon);
+ });
+ this.showGridPolygons = polygons;
+ }
}
diff --git a/src/app/routes/home-page/home-page/home-page.component.html b/src/app/routes/home-page/home-page/home-page.component.html
index e940d80..d330b28 100644
--- a/src/app/routes/home-page/home-page/home-page.component.html
+++ b/src/app/routes/home-page/home-page/home-page.component.html
@@ -93,7 +93,7 @@
������������GIS������
<small class="text-sm font-weight-normal">������: 128</small>
</ng-template>
- <iframe style="width: 100%; height: 500px;" target="_top" src="http://monitor-api2.7drlb.com/screen/map-page?areaCode=320583&accountId=1"
+ <iframe style="width: 100%; height: 500px;" target="_top" src="http://monitor-api2.7drlb.com/screen/map-page?areaCode=320583&accountId=1&mapType=BMAP_SATELLITE_MAP&isShowGrid=true"
frameborder="0"></iframe>
</nz-card>
</div>
diff --git a/src/app/routes/sand-table/sand-table.component.html b/src/app/routes/sand-table/sand-table.component.html
index 269beb9..14ec311 100644
--- a/src/app/routes/sand-table/sand-table.component.html
+++ b/src/app/routes/sand-table/sand-table.component.html
@@ -5,3 +5,6 @@
<heatmap [dataset]="heatData" [options]="heatOption" (loaded)="loadHeatmap($event)"></heatmap>
<control type="navigation" [options]="navigationOpts"></control>
</baidu-map>
+<nz-row nzGutter="8">
+ <div nz-col nzXs="24" nzSm="24" nzMd="24"><div id="map_temp" style="height: 800px; width: 600px;"></div></div>
+</nz-row>
diff --git a/src/app/routes/sand-table/sand-table.component.ts b/src/app/routes/sand-table/sand-table.component.ts
index e74bc88..3e5641f 100644
--- a/src/app/routes/sand-table/sand-table.component.ts
+++ b/src/app/routes/sand-table/sand-table.component.ts
@@ -4,7 +4,7 @@
@Component({
selector: 'app-sand-table',
- templateUrl: './sand-table.component.html',
+ templateUrl: './sand-table.component.html'
})
export class SandTableComponent implements OnInit {
options: MapOptions;
diff --git a/src/assets/app-data.json b/src/assets/app-data.json
index 1edc88b..a78b4a5 100644
--- a/src/assets/app-data.json
+++ b/src/assets/app-data.json
@@ -20,6 +20,11 @@
"link": "/home-page"
},
{
+ "text": "������������",
+ "icon": "icon-support",
+ "link": "/grid-trace"
+ },
+ {
"text": "������������",
"icon": "icon-pie-chart",
"link": "/forecasting-warning"
@@ -65,11 +70,6 @@
}]
},
{
- "text": "������������",
- "icon": "icon-support",
- "link": "/grid-trace"
- },
- {
"text": "������������",
"icon": "icon-wrench",
"children": [
@@ -88,27 +88,6 @@
"link": "/operation/device-maintenance"
}
]
- },
- {
- "text": "������������",
- "icon": "icon-flag",
- "children":[
- {
- "text": "���������������������",
- "link": "/raise-dust/real-time"
- },{
- "text": "���������������������",
- "link": "/raise-dust/statistical-query"
- },{
- "text": "������������",
- "link": "/raise-dust/image-grabbing"
- }
- ]
- },
- {
- "text": "������������",
- "icon": "icon-people",
- "link": "/sand-table"
}
]
}
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index 5691149..0fc0b3c 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -9,5 +9,5 @@
production: false,
hmr: false,
useHash: true,
- SERVER_BASH_URL: `http://monitor-api2.7drlb.com/`
+ SERVER_BASH_URL: `http://127.0.0.1:8080/`
};
--
Gitblit v1.8.0