uniapp做小程序内打开地图展示位置信息

  • 使用场景:项目中需要通过位置信息打开地图查看当前位置信息在地图那个位置,每个酒店有自己的经纬度和详细地址,点击地图按钮打开内置地图
  • 如图



方法如下:

html 复制代码
		<view class="dttu" @click="openMap(info.locationY,info.locationX,info.locationArea)">
						<image src="https://images.bocaihotel.net/images/dt.png" mode=""></image>
						<view class="">
							地图
						</view>
					</view>
javascript 复制代码
	// 打开地图
			openMap(latitudeStr, longitudeStr, address) {
				const latitude = parseFloat(latitudeStr);
				const longitude = parseFloat(longitudeStr);

				uni.openLocation({
					latitude: latitude, // 纬度
					longitude: longitude, // 经度
					address: address, // 地址的详细描述
					success() {
						console.log('地图打开成功');
					},
					fail(error) {
						console.error('地图打开失败', error);
					}
				});
			},

这样就可以啦,前期的准备工作要在微信公众平台进行申请相关的api哦~

相关推荐
StarChainTech7 分钟前
告别“催款”焦虑:如何打造一款高可用、多场景的智能代扣系统
大数据·人工智能·微信小程序·小程序·软件需求
小小王app小程序开发13 分钟前
剧本杀狼人杀小程序开发全解析(2026技术版)
小程序
程序媛徐师姐15 小时前
Java基于SSM的即时空教室查询小程序,附源码+文档说明
java·微信小程序·小程序·ssm·即时空教室查询小程序·java即时空教室查询小程序·即时空教室查询微信小程序
嘉琪00116 小时前
uni-app 核心坑点及解决方案——2026 0309
uni-app
Dragon Wu17 小时前
Taro Webpack 5 编译过慢的解决方案
前端·webpack·小程序·taro
吴声子夜歌18 小时前
小程序——界面API(一)
java·javascript·小程序
小小王app小程序开发19 小时前
场馆预约小程序核心玩法拆解与技术落地分析
小程序
行者-全栈开发19 小时前
uni-app 审批流程组件封装:打造企业级工作流可视化方案
uni-app
吴声子夜歌19 小时前
小程序——文件上传和下载
小程序
CHU72903520 小时前
便捷点餐,随心畅享——外卖点餐小程序前端功能详解
前端·小程序