美文网首页
高德地图会报高德地图加载报错-------禁止多种API加载方式

高德地图会报高德地图加载报错-------禁止多种API加载方式

作者: jesse28 | 来源:发表于2023-01-16 14:00 被阅读0次

    1.解决办法

    AMapLoader.reset()  需要把这个reset一下
    
     initMap() {
          console.log('执行了地图初始化')
          AMapLoader.reset()
          AMapLoader.load({
            key: '8804d4bc10b7e31f01d972370ed1f432', //此处填入我们注册账号后获取的Key
            version: '2.0', //指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
            plugins: [''] //需要使用的的插件列表,如比例尺'AMap.Scale'等
          })
            .then(AMap => {
              console.log('执行了地图',AMap)
              this.AMap = AMap
              this.map = new AMap.Map('mapCon', {
                //设置地图容器id
                zoom: 10, //初始化地图级别
                center: [106.57, 29.61] //初始化地图中心点位置-重庆市
              })
              AMap.plugin('AMap.Geocoder', () => {
                var geocoder = new AMap.Geocoder({
                  // city 指定进行编码查询的城市,支持传入城市名、adcode 和 citycode
                  city: '全国'
                })
                geocoder.getLocation(this.form.auditAddress ? this.form.auditAddress : '重庆市', (status, result) => {
                  console.log('定远', result)
                  if (status === 'complete' && result.info === 'OK') {
                    // result中对应详细地理坐标信息
                    this.form.addressLng = result.geocodes[0].location.lng
                    this.form.addressLat = result.geocodes[0].location.lat
                    // this.refreshMap() //重新定位地图
                  }
                })
              })
            })
            .catch(e => {
              console.log(e)
            })
        },
    

    2.输入中文定位地图位置

    <!-- 稽查地址 -->
            <van-field placeholder="请输入地址" @change="refreshMap" name="auditAddress" v-model="form.auditAddress" required :rules="[{ required: true, message: '请输入' }]" label="稽查地址:" />
            <!-- 高德地图 -->
            <div id="mapCon"></div>
    
      refreshMap() {
          this.AMap.plugin('AMap.Geocoder', () => {
                var geocoder = new AMap.Geocoder({
                  // city 指定进行编码查询的城市,支持传入城市名、adcode 和 citycode
                  city: '全国'
                })
                geocoder.getLocation(this.form.auditAddress ? this.form.auditAddress : '重庆市', (status, result) => {
                  console.log('定远', result)
                  if (status === 'complete' && result.info === 'OK') {
                    // result中对应详细地理坐标信息
                    this.form.addressLng = result.geocodes[0].location.lng
                    this.form.addressLat = result.geocodes[0].location.lat
                    this.map.setZoomAndCenter(16,[this.form.addressLng, this.form.addressLat])
                  }
                })
              })
        },
    

    相关文章

      网友评论

          本文标题:高德地图会报高德地图加载报错-------禁止多种API加载方式

          本文链接:https://www.haomeiwen.com/subject/ujpzcdtx.html