edit

src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.ts

@@ -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

src/app/shared/components/amap/amap-path-simplifier/amap-path-simplifier.component.ts

@@ -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._pois = changes?.pois?.currentValue;
-      this.markerList.render(this.pois);
+      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>;
 }