edit
This commit is contained in:
@ -79,8 +79,6 @@ export class OrderManagementVehicleDetailComponent implements OnInit {
|
||||
initData() {
|
||||
this.service.request(this.service.$api_get_getWholeBillDetail, { id: this.id }).subscribe(res => {
|
||||
if (res) {
|
||||
console.log(res);
|
||||
|
||||
this.i = res;
|
||||
this.pois = [
|
||||
{
|
||||
@ -90,7 +88,7 @@ export class OrderManagementVehicleDetailComponent implements OnInit {
|
||||
title: res.startingPoint.detailedAddress
|
||||
},
|
||||
{
|
||||
markerLabel: '终',
|
||||
markerLabel: '卸',
|
||||
color: 'red',
|
||||
position: [res.endPoint.longitude, res.endPoint.latitude],
|
||||
title: res.endPoint.detailedAddress
|
||||
|
||||
@ -16,9 +16,11 @@ const CONFIG = amapConf;
|
||||
export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
aMap: any;
|
||||
pathSimplifierIns: any;
|
||||
geocoder: any;
|
||||
navigator: any;
|
||||
infoWindow: any;
|
||||
markerList: any;
|
||||
SimpleMarker: any;
|
||||
@Input()
|
||||
pathList: any = [];
|
||||
@Input()
|
||||
@ -34,6 +36,7 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
|
||||
@Input()
|
||||
pois: any = [];
|
||||
private _pois: any = [];
|
||||
|
||||
constructor(public service: BaseService) {}
|
||||
ngOnChanges(changes: SimpleChanges): void {
|
||||
@ -42,20 +45,23 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
this.setPathIndex(this.selectedIndex);
|
||||
}
|
||||
if (changes?.MapList?.currentValue && this?.pathSimplifierIns && changes.MapList?.currentValue.length > 0) {
|
||||
// console.log(this.MapList);
|
||||
console.log(this.MapList);
|
||||
this.pathList = [
|
||||
{
|
||||
name: '路线1',
|
||||
points: changes?.MapList?.currentValue
|
||||
points: changes.MapList?.currentValue
|
||||
}
|
||||
];
|
||||
this.setData(this.pathList);
|
||||
this.setPathIndex(this.selectedIndex);
|
||||
this.getPoiByPositon(this.MapList[this.MapList?.length - 1]?.lnglat);
|
||||
}
|
||||
if (changes?.pois?.currentValue && this?.markerList && changes.pois?.currentValue.length > 0) {
|
||||
if (changes?.pois?.currentValue) {
|
||||
// console.log(this.pois);
|
||||
this.pois = changes?.pois?.currentValue;
|
||||
this.markerList.render(this.pois);
|
||||
this._pois = changes?.pois?.currentValue;
|
||||
if (this?.markerList && this._pois.length > 0) {
|
||||
this.markerList.render(this._pois);
|
||||
}
|
||||
}
|
||||
}
|
||||
ngOnInit(): void {
|
||||
@ -74,7 +80,8 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
plugins: [
|
||||
// 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
||||
'AMap.PathSimplifier',
|
||||
'AMap.InfoWindow'
|
||||
'AMap.InfoWindow',
|
||||
'AMap.Geocoder'
|
||||
],
|
||||
AMapUI: {
|
||||
version: CONFIG.AMapUIVersion,
|
||||
@ -91,6 +98,9 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
this.infoWindow = new AMap.InfoWindow({
|
||||
offset: new AMap.Pixel(0, -40)
|
||||
});
|
||||
this.geocoder = new AMap.Geocoder({
|
||||
radius: 1000 //范围,默认:500
|
||||
});
|
||||
// this.service.msgSrv.info('地图加载完成 !');
|
||||
this.pathInit();
|
||||
this.setPOIS();
|
||||
@ -122,7 +132,7 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
//point
|
||||
return pathData.name + ',' + pathData.points[pointIndex].name;
|
||||
}
|
||||
return pathData.name + ',点数量' + pathData.points?.length;
|
||||
return '';
|
||||
},
|
||||
renderOptions: {
|
||||
renderAllPointsIfNumberBelow: 10 //绘制路线节点,如不需要可设置为-1
|
||||
@ -159,7 +169,7 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
recycledMarker.setIconStyle(dataItem.iconStyle);
|
||||
return recycledMarker;
|
||||
}
|
||||
|
||||
this.SimpleMarker = SimpleMarker;
|
||||
//返回一个新的Marker
|
||||
return new SimpleMarker({
|
||||
//普通文本
|
||||
@ -185,9 +195,9 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
}
|
||||
});
|
||||
|
||||
if (this.pois?.length > 0) {
|
||||
if (this._pois?.length > 0) {
|
||||
//展示该数据
|
||||
this.markerList.render(this.pois);
|
||||
this.markerList.render(this._pois);
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -213,10 +223,60 @@ export class AmapPathSimplifierComponent implements OnInit, OnChanges {
|
||||
}
|
||||
}
|
||||
|
||||
/** 根据经纬度获取地址信息 */
|
||||
getPoiByPositon(position: Array<string>) {
|
||||
this.geocoder.getAddress(position, (status: any, result: any) => {
|
||||
if (status === 'complete' && result.info === 'OK') {
|
||||
// result中对应详细地理坐标信息
|
||||
this._pois = [...this.pois, { markerLabel: '终', color: 'red', position: position, title: result.regeocode.formattedAddress }];
|
||||
if (this.markerList) {
|
||||
this.markerList.render(this._pois);
|
||||
}
|
||||
// this.setPOI({ markerLabel: '终', color: 'red', position: position });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 选中标点,设置窗口信息
|
||||
* @param location
|
||||
*/
|
||||
selectedPOI(location: any) {
|
||||
this.infoWindow.setContent(`地址: <pre>${location.title}</pre>`);
|
||||
this.infoWindow.open(this.aMap, location.position);
|
||||
this.infoWindow.setPosition(location.position);
|
||||
this.aMap.setCenter(location.position);
|
||||
}
|
||||
|
||||
/**
|
||||
* 增加标记点
|
||||
* @param poi
|
||||
*/
|
||||
setPOI(poi: POI) {
|
||||
AMapUI.loadUI(['overlay/SimpleMarker'], (SimpleMarker: any) => {
|
||||
//启动页面
|
||||
new SimpleMarker({
|
||||
//普通文本
|
||||
iconLabel: {
|
||||
//普通文本
|
||||
innerHTML: poi.markerLabel,
|
||||
//设置样式
|
||||
style: {
|
||||
color: '#fff',
|
||||
fontSize: '110%',
|
||||
marginTop: '2px'
|
||||
}
|
||||
},
|
||||
iconStyle: poi.color,
|
||||
map: this.aMap,
|
||||
position: poi.position
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export interface POI {
|
||||
markerLabel: string;
|
||||
color: string;
|
||||
position: Array<string>;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user