Skip to content

S
supervise-front
Commit ab2f809c by niuxiaolin
Options

latest

parent 5ecc78f4
Showing with 52 additions and 36 deletions
angular.json
......@@ -33,7 +33,9 @@
],
"scripts":[
"src/getscript.js",
"src/assets/GeoUtils.js",
"src/assets/mapv.js"
],
"es5BrowserSupport": true
},
......
src/app/main/main.component.html
......@@ -21,11 +21,11 @@
<option *ngFor="let c of projects2" [value]="c.id" >{{c.name}}</option>
</select>
</div>
<baidu-map #map [options]="opts">
<!-- <baidu-map #map [options]="opts">
<polyline [points]="points" [options]="polylineOptions" (loaded)="polylineLoaded($event)"
(clicked)="polylineClicked($event)"></polyline>
</baidu-map>
</baidu-map> -->
<div id="baidu-map"></div>
<div class="main">
<div class="left">
<fieldset>
......
src/app/main/main.component.less
......@@ -72,7 +72,7 @@
.focus{
background: #ea262d96!important;
}
baidu-map{
#baidu-map{
width: 100%;
height: 900px;
display: block;
......
src/app/main/main.component.ts
......@@ -14,7 +14,7 @@ import { ActivatedRoute, Router } from '@angular/router';
import { IdService } from '../services/id.service';
import { SelfMapService } from '../services/map.service';
declare var map: any;
declare var BMap: any;
declare var BMapLib: any;
declare var drawingManager: any;
......@@ -45,7 +45,7 @@ export class MainComponent implements OnInit {
curiveLength:number = 10;
theme: any;
markers: any;
map: any;
constructor(private m:SelfMapService, private router:Router, private idService: IdService, private route: ActivatedRoute, private cd: ChangeDetectorRef, private http: HttpClient, private dynamicScriptLoader: DynamicScriptLoaderService, private modalService: ModalService, private s: DefaultService) {
//定位山西省地图
this.opts = {
......@@ -115,7 +115,7 @@ export class MainComponent implements OnInit {
var toPoints = this.m.toPoints(points,this.curiveLength,this.curive);
var newPolyLine = new window.BMap.Polyline(toPoints, { strokeColor: proj.lineStyle, strokeWeight: proj.lineWidth });
(newPolyLine as any).id = (proj.course ? "p" : "s") + proj.id;
map.addOverlay(newPolyLine);
this.map.addOverlay(newPolyLine);
// var newPoints = this.corToPoint(proj.coordinate);
// this.m.animationLine(newPoints);
......@@ -124,6 +124,16 @@ export class MainComponent implements OnInit {
this.router.navigate(['/video']);
}
ngOnInit(): void {
this.map = new window.BMap.Map(document.getElementById("baidu-map"), {
centerAndZoom: {
lat: 37.78663390039693,
lng: 112.43176242674386,
zoom: 10,
}});
this.map.setMapStyleV2({ styleJson: theme });
this.map.enableScrollWheelZoom(true);
this.map.centerAndZoom("山西省",11);
this.route.queryParamMap.subscribe(queryParams => {
this.debug = Boolean(queryParams.get("debug"))
})
......@@ -167,7 +177,7 @@ export class MainComponent implements OnInit {
}
proj2Change($event, type) {
map.clearOverlays();
this.map.clearOverlays();
var proj: any = {};
if (type == 1) {
} else {
......@@ -176,7 +186,7 @@ export class MainComponent implements OnInit {
proj = this.projects1.find(f => f.id == $event);
this.addPoly(proj);
var points = this.corToPoint(proj.coordinate);
map.setViewport(points);
this.map.setViewport(points);
}
loadLabels(data){
......@@ -197,7 +207,7 @@ export class MainComponent implements OnInit {
var points = this.loadPolys(res,true);
});
}else{
map.centerAndZoom("山西省",8);
this.map.centerAndZoom("山西省",8);
}
}
......@@ -217,7 +227,7 @@ export class MainComponent implements OnInit {
}
toNormal() {
map.clearOverlays();
this.map.clearOverlays();
this.normalShow = !this.normalShow;
......@@ -237,7 +247,7 @@ export class MainComponent implements OnInit {
}
highLight(i: number, obj, type) {
this.currProj = Object.assign({}, obj);
var overlays = map.getOverlays();
var overlays = this.map.getOverlays();
var cur = overlays.find(o => o.id == type + obj.id);
timer(0, 200)
.pipe(timeInterval(), pluck('interval'), take(6)).subscribe(index => {
......@@ -252,7 +262,7 @@ export class MainComponent implements OnInit {
//标段不定位
if(type!='s'){
map.setViewport(points);
this.map.setViewport(points);
}
......@@ -320,9 +330,9 @@ export class MainComponent implements OnInit {
this.setBound();
(window as any).map.setMapStyleV2({ styleJson: theme });
map.enableScrollWheelZoom(true);
map.centerAndZoom("山西省",11);
// (window as any).map.setMapStyleV2({ styleJson: theme });
// this.map.enableScrollWheelZoom(true);
// this.map.centerAndZoom("山西省",11);
this.dynamicScriptLoader.load('geouti',"mapv").then();
if (this.debug) {
......@@ -396,7 +406,7 @@ export class MainComponent implements OnInit {
setBound() {
var project = map.getMapType().getProjection();
var project = this.map.getMapType().getProjection();
var getPathStr = function (overlay) {
var pathStr = "";
var path = overlay.getPath();
......@@ -430,11 +440,11 @@ export class MainComponent implements OnInit {
var SE_JW = "170.672126, -68.045308 ;"; //东南角
//3.添加环形遮罩层
var ply1 = new BMap.Polygon(ENWS + E_JW + SE_JW + S_JW + WS_JW + W_JW + NW_JW + N_JW + EN_JW + E_JW, {strokeColor:"none",strokeOpacity:0,fillColor:"#0002069c",fillOpacity:"0.5"}); //建立多边形覆盖物
map.addOverlay(ply1);//遮罩物是半透明的，如果需要纯色可以多添加几层
this.map.addOverlay(ply1);//遮罩物是半透明的，如果需要纯色可以多添加几层
//4. 给目标行政区划添加边框，其实就是给目标行政区划添加一个没有填充物的遮罩层
var ply = new BMap.Polygon(rs.boundaries[0], {strokeWeight:0,strokeColor:"#16e8d6",fillColor:"",fillOpacity:"0"});
map.addOverlay(ply);
map.setViewport(ply.getPath());//调整视野
this.map.addOverlay(ply);
this.map.setViewport(ply.getPath());//调整视野
//获取行政区域
// map.clearOverlays(); //清除地图覆盖物
......@@ -481,7 +491,7 @@ export class MainComponent implements OnInit {
* @param type "s" = section ,"p"=project
*/
getOverlayById(id: number, type: string = "p") {
var overlays = map.getOverlays();
var overlays = this.map.getOverlays();
return overlays.find(o => o.id == type + id);
}
addLabel(points:Array<Point>,proj){
......@@ -500,7 +510,7 @@ export class MainComponent implements OnInit {
</div>`, {
position: center
});
map.addOverlay(label);
this.map.addOverlay(label);
}
......@@ -515,7 +525,7 @@ ${label.name}
position: JSON.parse(label.coordinate),
// offset:{width:5,height:-10}
});
map.addOverlay(label);
this.map.addOverlay(label);
}
}
......
src/assets/mapv.js
......@@ -483,6 +483,9 @@
render: function (points, context) {
if(window.timeoutIDForLine){
clearTimeout(window.timeoutIDForLine)
}
console.log(points)
var index = 1;
var step = 2;
......@@ -490,6 +493,7 @@
var movStart = Object.assign({},points[0]);
var next = points[index];
var canvas = context.canvas;
var backDom = document.createElement('canvas'),
backCtx = backDom.getContext('2d');
backDom.width = canvas.width;
......@@ -557,7 +561,7 @@
movStart =Object.assign({},points[index - 1]) ;
current =Object.assign({},movStart) ;
}
setTimeout(renderBody, 1);
window.timeoutIDForLine=setTimeout(renderBody, 1);
}
renderBody();
......
src/getscript.js
......@@ -2,51 +2,51 @@ window.TILE_VERSION = {
"ditu": {
"normal": {
"version": "088",
"updateDate": "20190726"
"updateDate": "20190802"
},
"satellite": {
"version": "009",
"updateDate": "20190726"
"updateDate": "20190802"
},
"normalTraffic": {
"version": "081",
"updateDate": "20190726"
"updateDate": "20190802"
},
"satelliteTraffic": {
"version": "083",
"updateDate": "20190726"
"updateDate": "20190802"
},
"mapJS": {
"version": "104",
"updateDate": "20190726"
"updateDate": "20190802"
},
"satelliteStreet": {
"version": "083",
"updateDate": "20190726"
"updateDate": "20190802"
},
"earthVector": {
"version": "001",
"updateDate": "20190726"
"updateDate": "20190802"
}
},
"webapp": {
"high_normal": {
"version": "001",
"updateDate": "20190726"
"updateDate": "20190802"
},
"lower_normal": {
"version": "002",
"updateDate": "20190726"
"updateDate": "20190802"
}
},
"api_for_mobile": {
"vector": {
"version": "002",
"updateDate": "20190726"
"updateDate": "20190802"
},
"vectorIcon": {
"version": "002",
"updateDate": "20190726"
"updateDate": "20190802"
}
}
};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment