uniapp中引入高德地图高德地图自己会偏移移动

1、地图无操作下出现缓慢的自行移动:

2,问题原因: @regionchange 方法不断被触发,且不移动时获取的维度坐标总比我们当前的 -1 

3,解决方法:通过限制静态时触发的偏移量,不触发对应的区域接口,各位的数据偏移量和方向可能各有不同,需要根据具体的问题进行设置。

4,具体代码:

//滑动了地图
changeMap(e) {
  console.log('滑动');
  const that = this;
  that.mapContext = uni.createMapContext("map", that);
  console.log('that.mapContext', that.mapContext);

  that.mapContext.getCenterLocation({
    type: 'gcj02',
    success: (res) => {
      // 对静态移动标点做限制防止偏移
      if(that.latitude - res.latitude < 0.000005 &&  that.list.length > 0) {
       return
      }
      // 更新地图中心坐标
      that.latitude = res.latitude;
      that.longitude = res.longitude;
      console.log( 'that.latitude', that.latitude)
      const latitude = that.latitude;
      const longitude = that.longitude;
  • 11
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在uniapp引入高德地图的代码应该包含以下步骤:1.首先在uniapp项目安装高德地图插件,可以使用npm或yarn安装;2.然后在main.js文件引入高德地图插件;3.最后在vue文件使用高德地图插件。 ### 回答2: 在uniapp引入高德地图的代码可以通过以下步骤实现: 1. 首先,在你的uniapp项目的`static`目录下新建一个名为`amap`的文件夹。将从高德地图开放平台申请的Web API的JavaScript SDK文件(名为`v1.4.15.AMap.js`)放入该文件夹。 2. 在`static`目录下新建一个名为`amapui`的文件夹。将从高德地图开放平台申请的Web API的扩展插件AMapUI文件(名为`v1.1.1.AMapUI.min.js`)放入该文件夹。 3. 在`pages.json`文件的`"pages"`属性添加需要使用地图的页面路径,如`"pages/map"`。 4. 在需要使用地图的页面引入`amap`和`amapui`目录下的JavaScript文件。可以通过如下方式引入: ```html <script src="/static/amap/v1.4.15.AMap.js"></script> <script src="/static/amapui/v1.1.1.AMapUI.min.js"></script> ``` 5. 在使用地图的页面,可以通过编写JavaScript代码初始化地图: ```javascript mounted() { AMap.initAMapUI(); // 初始化AMapUI组件库 this.initMap(); // 初始化地图 }, methods: { initMap() { const map = new AMap.Map('map-container', { // 地图配置项 }); // 具体地图操作和功能设置 } } ``` 6. 在需要显示地图的页面,添加一个具有固定大小的`div`容器,并设置一个唯一的id作为地图容器的标识。在上述代码的`initMap`方法,将地图容器的id作为参数传递给`AMap.Map`的第一个参数。 以上就是在uniapp引入高德地图的代码的基本步骤。请确保已经在高德地图开放平台申请了Web API的key,并在具体的应用场景下根据需要进行地图操作和功能设置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值