ShangHaiYuan-AnXin/src/app/key-unit/water-road/water-road.component.ts

import { Component, Inject, OnInit } from '@angular/core';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
declare var AMap: any;
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';

@Component({
  selector: 'app-water-road',
  templateUrl: './water-road.component.html',
  styleUrls: ['./water-road.component.scss']
})
export class WaterRoadComponent implements OnInit {

  constructor(public snackBar: MatSnackBar,public dialog: MatDialog) { }
  isshow:boolean = true
  textcontant:any = localStorage.getItem(sessionStorage.getItem("companyId") + "waterroad") || ""
  clickicon(){
    this.isshow = !this.isshow
  }
  save(){
    localStorage.setItem(sessionStorage.getItem("companyId") + "waterroad",this.textcontant)
    const config = new MatSnackBarConfig();
    config.verticalPosition = 'top';
    config.duration = 3000
    this.snackBar.open('保存成功','确定',config);
  }
  map:any //地图

  
  ngOnInit(): void {
    
    setTimeout(() => {
      this.creatMap()
     
    }, 0);
  }


  creatMap(){
    var satellite = new AMap.TileLayer.Satellite();
    var roadNet = new AMap.TileLayer.RoadNet();
    
    // 创建一个 icon
    var startIcon = new AMap.Icon({
      image: '../../../assets/images/fireHydrant.png',
      // // 图标所用图片大小
      imageSize: new AMap.Size(20, 20),
      // // 图标取图偏移量
      // imageOffset: new AMap.Pixel(-9, -3)
    });
    let arr = [{lng:108.299405,lat: 22.894884},
              {lng:108.597409,lat: 22.80883},
              {lng:108.689419,lat: 23.061775},
              {lng:107.971188,lat: 22.950537},
              {lng:107.847592,lat: 23.090833},
              {lng:108.176374,lat: 22.790585},
              {lng:108.407087,lat: 22.671522},
              {lng:108.158521,lat: 22.61322},
              {lng:107.925062,lat: 22.565038},
              {lng:108.180494,lat: 22.501616},
              {lng:107.743222,lat: 22.535121},
              {lng:108.373809,lat: 22.764746},
              {lng:108.378895,lat: 22.761877},
              {lng:108.383337,lat: 22.766467},
              {lng:108.37647,lat: 22.763341},
              {lng:108.37662,lat: 22.767397},
              {lng:108.378916,lat: 22.758513},
              {lng:108.379045,lat: 22.765695},
              {lng:108.384731,lat: 22.760096},]
    let Arr = []
    arr.forEach(item=>{
      let viaMarker = new AMap.Marker({
        position: new AMap.LngLat(item.lng, item.lat),
        icon: startIcon,
        offset: new AMap.Pixel(-10, -10)
      })
      Arr.push(viaMarker)
    })
    var markerIcon = new AMap.Icon({            
      image:"//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png",
      size: new AMap.Size(52, 52),  //图标大小
      imageSize: new AMap.Size(26,36)
    }) 
    let marker1 = new AMap.Marker({
      icon: markerIcon,
      position: [108.377865, 22.763499],
      offset: new AMap.Pixel(-4, -50)
    });
  
    this.map = new AMap.Map('map',{
      center: [108.377865, 22.763499], //初始地图中心点
      zoom: 16
    });
    marker1.setMap(this.map);
    this.map.on('click', (e) => {
      console.log(e.lnglat.getLng() + ',' + e.lnglat.getLat()) 
    });

    // this.map.setCity('南宁市')
    this.map.add(Arr);//火源标点


  }

  opendialog(){
    let dialogRef = this.dialog.open(EditText);
    dialogRef.afterClosed().subscribe(data=>{
      if(data){
      
      }
    });  
  }
}


//编辑水源道路情况
@Component({
  selector: 'app-editBuilding',
  templateUrl: './edittext.html',
  styleUrls: ['./water-road.component.scss']
})
export class EditText {
  
  constructor(public snackBar: MatSnackBar,public dialog: MatDialog,public dialogRef: MatDialogRef<EditText>,@Inject(MAT_DIALOG_DATA) public data) { }
  textcontant:any =  localStorage.getItem(sessionStorage.getItem("companyId") + "waterroad") || ""//输入内容
  iseditsix = true
  ngOnInit(): void {
    if(sessionStorage.getItem("six") == "look"){
      this.iseditsix = false
    }else if(sessionStorage.getItem("six") == "edit"){
      this.iseditsix = true
    }
  }


  //确定
  ok(){
    localStorage.setItem(sessionStorage.getItem("companyId") + "waterroad",this.textcontant)
    const config = new MatSnackBarConfig();
    config.verticalPosition = 'top';
    config.duration = 3000
    this.snackBar.open('保存成功','确定',config);
    this.dialogRef.close();
  }
  //取消
  cancel(){
    this.dialogRef.close();
  }
}