uniapp开发APP的超级无敌坑！！！map地图组件的getCenterLocation 没有回调问题，map地图不显示点位问题

最新推荐文章于 2024-04-26 10:50:51 发布
最新推荐文章于 2024-04-26 10:50:51 发布
阅读量605 收藏
点赞数
文章标签： uni-app 小程序 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pirs123/article/details/134788580
版权

在这里简单建议一下如果公司项目不是很紧急的情况，能学一些别的app开发技术栈就学，uniapp坑太多了，不建议开发含有地图或者其他复杂的app。

公司现在是有小程序，用uniapp做的，但是现在要急上app只能通过uniapp来编译达到快速上线的目的。

坑来了！！！！

编译运行到手机上时map地图的markes地图点位全部消失，包括地图上面的已经图标，我百思不得其解，后来找度娘才知道，要用nvue才能支持，后面我就加了nvue绘制了一个地图，真的能显示点位了

但是问题来了，当我想使用getCenterLocation移动地图获取经纬度的时候竟然不给我回调，于是我又去找度娘，结果问的倒是有，解决这个问题的没找到。

没有办法我自己摸索，经过我一顿异于常人的操作后终于发现了诀窍。

思路：因为刚开始vue文件的地图不显示点位，我就想是不是因为这个文件包有home.vue文件呢，于是我新建了一个新的文件包

神奇的事情发生了，当我再次移动地图是，终于有回调了，拿到了经纬度

Pir。。。。
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
深色风格google map 地图app ui .xd .ai .psd素材下载
04-20
深色风格google map 地图app ui .xd .ai .psd素材下载
uni-app-地图中心设置图标-获取坐标
傲娇的晓明
12-16 2169
1. 在地图中加入一个自己需要的图标，一般使用图片，定位方便 <map style="width: 100%; height: 100%;" id="map" :latitude="latitude" :longitude="longitude" :markers="markers" :scale='scale' :circles="circles" @markertap='toChangePoint' show-locati
Uniapp - 地图map组件及使用
Ainke
06-30 7104
Uniapp是一个基于Vue.js开发的跨平台应用开发框架，通过一套代码，可以同时发布到多个平台，包括iOS、Android、Web等。它提供了丰富的组件库和开发工具，大大简化了移动应用开发的流程，极大地提高了开发效率。Uniapp提供了地图组件，可以方便地在应用中集成地图功能。该地图组件基于第三方地图服务商提供的API，支持常见的地图功能，如显示地图、添加标记点、添加覆盖物等。# 4.地图组件的基本用法本篇博客介绍了Uniapp地图组件的基本用法和一些高级用法。
uni-app开发微信小程序 - 地图，安卓端无法加载出marker标记点
傲娇的晓明
12-29 2918
个人使用uni-app开发的微信小程序 使用map组件时，遇到了安卓和iOS端小程序不兼容的问题 首先，map组件的markers中必须有id字段 其次，向markers中增加字段时，安卓端不支持直接向data中的数据push新增点位 如下代码，在iOS的小程序端没有问题，安卓的小程序端将不渲染markers this.markers.push({ id: 3, latitude: 39.909, longitude: 116.39742, }) 做如下修改 let
微信小程序MAP地图开发入门(一)
03-29
作者：北辰，来自原文地址  相关文章：跳坑《一百零五》map组件，地图使用相关问题  根目录下 app.js, app.json, app.wxss解释  (此图片来源于网络，如有侵权，请联系删除! ) 2.1 app.js 小程序的逻辑  2.2 app.json小程序的公共设置  2.3 app.wxss 小程序的公共样式表 在app.json 配置个tab ( 类似于iOS tabbar)   { "pages":[ // 文件所在目录结构 // index.js logs.js setup.js "pages/index/index", "pages/logs/logs", "page
uniapp-小程序开发map地图组件的@regionchange首页刷新的时候连续执行问题
pirs123的博客
08-29 1419
公司做的是电瓶车换电项目，所已涉及用到地图展示线下换电点位，由于点位过多一次性请求出来性能非常大，对用户体验也不好，所有用到了@regionchange来实现根据当前位置返回附近几公里范围的点位...
uni-app使用map组件开发map地图，获取后台返回经纬度进行标点
m0_46598549的博客
05-19 6486
这段时间在开发uniapp的时候使用到map组件 总结一下本次在uniapp中使用map遇到的一些问题
uniapp地图自定义组件拖拽获取中心经纬度
LLL_liuhui的博客
11-11 2619
@regionchange="regionchange" ： 地图滑动调用的方法 <map id="maps" class="map" :longitude="longitude" :latitude="latitude" :markers="markers" :polyline="polyline" :include-points="points" @tap="mapTap" @regionchange="regionchange"></map> regioncha.
uniapp APP、H5和微信小程序 使用百度地图，H5动态加载百度地图sdk，cover-image图片不显示，标准基座模拟器地图不显示，表单校验字段[‘**‘]在数据库中不存在
weixin_43965143的博客
11-16 3432
【代码】uniapp APP和H5使用百度地图，cover-image有时不显示，标准基座模拟器地图不显示，H5动态加载百度地图sdk。
uniapp_map组件
05-26
uniapp 中使用leaft的加载高德地图，支持创建、撒点、轨迹、区域、geojson
微信小程序开发——map地图组件，定位，并手动修改位置偏差。 ...
03-29
环境搭建注册，获取APPID（没有这个不能真鸡调试）下载微信web开发者工具（挺多bug，将就用）打开微信web开发者工具，扫码登录，新建小程序，输入APPID，勾选创建quick start项目。工 ...       环境搭建 注册，获取APPID（没有这个不能真鸡调试） 下载微信web开发者工具（挺多bug，将就用） 打开微信web开发者工具，扫码登录，新建小程序，输入APPID，勾选创建quick start项目。   工程结构 可以看到工程根目录中有个app.js，这里可以定义全局变量，通过getApp()获取。  项目中有了一些示例，已经有了获取用户信息的方法等。   开发地图定位
微信小程序开发之map地图组件定位并手动修改位置偏差
12-01
开发地图定位，选择位置功能 我们直接修改index页面来做这个功能。 准备 新建imgs目录，加入2个图标（ic_location和ic_position），用于标记当前位置，和地图中央位置。 添加定位功能 修改app.js
UniApp 项目中的生命周期详解：从诞生到逝去
weixin_47238919的博客
04-22 504
通过本文的介绍，相信你对 UniApp 中的生命周期有了更加深入的理解。合理利用生命周期钩子函数可以更好地管理应用程序的状态和行为，从而提升应用的用户体验和开发效率。
【uniapp/ucharts】采用 uniapp 框架的 h5 应用使用 ucharts（没有 uni_modules）
最新发布
花间半盘棋
04-26 201
然后按照图片中 README 所写的方式在项目中进行导入；下载的文件是如图所示的路径；就可以正常显示图表啦。
uniapp 页面滚动到指定位置的方法
--=
04-23 280
uniapp 页面滚动到指定位置的方法
从零开始：UniApp 项目搭建指南
weixin_47238919的博客
04-22 457
通过本文的指南，相信你已经对如何搭建一个 UniApp 项目有了更加清晰的认识。UniApp 的跨平台特性为移动应用开发带来了全新的可能性，希望你能够在未来的项目中充分发挥其优势，创造出更加优秀的应用作品。
UniApp状态管理：从深入理解到灵活运用
weixin_47238919的博客
04-22 690
在UniApp中，状态管理是指管理应用程序中各种数据的方法。这些数据可以是用户信息、应用配置、页面状态等。良好的状态管理能够使应用程序的数据流动更加清晰、可控，从而提升应用的性能和用户体验。本文从理论到实践，从基础到高级，全面介绍了UniApp中的状态管理。希望通过本文的阅读，读者能够更加深入地理解状态管理的重要性，并能够在实际开发中灵活运用状态管理的技巧。
使用uni-app开发app时遇到mqtt.js不可用的问题
Alan_Walker688的博客
04-24 817
使用uni-app开发app时遇到mqtt.js不可用的问题踩坑与记录。
uniapp 开发app怎么使用高德地图
07-13
要在Uniapp中使用高德地图，你可以按照以下步骤进行操作： 1. 首先，你需要在高德开放平台上注册一个开发者账号，并创建一个应用。获取你的高德地图API Key。 2. 在Uniapp项目中，使用插件市场中的`uni-amap`插件或者手动引入高德地图的JavaScript API库。 - 使用`uni-amap`插件：在HBuilderX中打开插件市场，搜索并安装`uni-amap`插件。 - 手动引入：在Uniapp项目中的`index.html`文件中添加以下代码引入高德地图的JavaScript API库： ```html <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=YOUR_API_KEY"></script> ``` 注意替换`YOUR_API_KEY`为你在高德开放平台上获取的API Key。 3. 在需要使用高德地图的页面中，使用`<view>`组件创建一个地图容器，并给它一个固定的宽度和高度。 4. 在页面的`<script>`标签中，引入高德地图的JavaScript API库后，可以通过`AMap`全局对象来使用高德地图的相关功能。 ```javascript export default { onReady() { // 创建地图实例 const map = new AMap.Map('map-container', { zoom: 10, // 设置地图缩放级别 center: [longitude, latitude] // 设置地图中心点坐标 }); // 添加标记点 const marker = new AMap.Marker({ position: [longitude, latitude] // 设置标记点坐标 }); map.add(marker); } } ``` 注意替换`longitude`和`latitude`为你需要显示的地图中心点和标记点的经纬度。 这样，你就可以在Uniapp中使用高德地图了。你可以根据高德地图的开发文档，进一步了解如何使用其它功能，例如搜索、路线规划等。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值