高德实现简单的地图 ＋定位@amap/amap-jsapi-loader 经纬度

<template>
        <div class="map_box">
          <div id="map"></div>
        </div>

</template>
<script>
import AMapLoader from '@amap/amap-jsapi-loader'
export default {
  data() {
    return {
    }
  },

  methods:{
    
    initAMap(jing, wei) {
      let _this = this
      AMapLoader.load({
        key: 'ccbad877e365ac35426acc236edf88b3',
        version: '2.0',
        plugins: [
          'AMap.Scale',
          'AMap.ToolBar',
          'AMap.ControlBar',
          'AMap.Geocoder',
          'AMap.Marker',
          'AMap.CitySearch',
          'AMap.Geolocation',
          'AMap.AutoComplete',
          'AMap.InfoWindow',
          'AMap.PlaceSearch'
        ]
      }).then(AMap => {
        var address = '浙江省杭州市拱墅区东方茂商业中心2幢1715-1716室'
        var autoOptions = {
          city: '杭州市',

          map: _this.map, // 展现结果的地图实例

          pageSize: 1, // 单页显示结果条数

          pageIndex: 1, // 页码

          autoFitView: true // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
        }
        var placeSearch = new AMap.PlaceSearch(autoOptions)
        placeSearch.search(address, function(status, result) {
          // 搜索成功时，result即是对应的匹配数据
          if (status == 'complete') {
            if (result.poiList.pois.length == 0) {
              // console.log('没有查询到对应的地址')
            } else {
              let lng = result.poiList.pois[0].location.lng

              let lat = result.poiList.pois[0].location.lat

              _this.map = new AMap.Map('map', {
                zoom: 13, //初始化地图级别
                center: [lng, lat] // 初始化中心点坐标 广州
              })

              const marker = new AMap.Marker({
                position: [lng, lat] //位置
              })
              _this.map.add(marker) //添加到地图
            }
          } else if (status == 'no_data') {
            // console.log('没有查询到对应的地址')
          }
        })
      })
    },
  },
  mounted(){
    this.initAMap(116.39, 39.9)
  },

}
</script>
<style lang="less" scoped>
.map_box {
                width: 97%;
                height: 400px;
                border: 1px solid #333;
                margin: 10px auto;
            
                #map {
                  width: 100%;
                  height: 100%;
                }
              }
</style>