已知经纬度自动在地图上标点

需求

通过一个按钮，打开地图拿到这个显示的位置的经纬度，在地图上找到这个位置

给按钮绑定事件

这个事件需要打开对话框，并且拿到经纬度

<el-button type="primary" size="mini" plain @click="mapClick(projectData.lonLat)">查看位置</el-button>

实现这个方法

mapClick(lonLat){
      let num1 = new Array()
      num1 = lonLat.split(',')
      this.mapDialogVisible = true
      //打印出来的黑色数字是字符串，蓝色的才是数字
      const longitude = Number(num1[0])//经度
      const latitude = Number(num1[1])//纬度
      // 定义点标记对象
      this.$nextTick(() => {
        this.initMap(longitude,latitude)
      })
    }

这里进行解释一下：lonLat就是那个传过来的经纬度，在这里需要将他拆分字符串，用到了split这个方法，是js里的； this.mapDialogVisible = true这个就是打开对话框，再将拆分的字符串转化成数字赋值给longitude和latitude，那个this.initMap就是实例化这个地图

实例化地图组件

如果不实例化地图的话，是展示不出地图的，
在上面写那个方法的时候我们将经纬度传过来了，所以在这里直接lng,lat进行接收，记得在return中初始化这个地图

使这个初始化地图的中心点设置为传过来的经纬度，这样就可以随着你经纬度的不同，展示的地图的位置也会随之改变，下面那个projectMapMarker就是一个标点的marker，官网里是有说明的，高德地图点标记官网

initMap(lng,lat) {
      this.mapLocal = new AMap.Map("container", {
        resizeEnable: true,
        //禁止拖动地图
        // dragEnable: false,
        //禁止放大地图
        // zoomEnable:false,
        center: [lng,lat],
        zoom: 16,//地图显示的缩放级别
      })
      const projectMapMarker =  new AMap.Marker({
        position: [lng, lat],
        icon: 'https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
      })
      // 添加点标记在地图上
      projectMapMarker.setMap(this.mapLocal)
    },

最后是通过官网的一个setMap方法将我们建立的点，标记在地图上，这样就做好了这样的效果。