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哦~

相关推荐
土土哥V_araolin5 分钟前
双迪大健康新零售系统开发要点
小程序·个人开发·零售
2501_915909062 小时前
不用越狱就看不到 iOS App 内部文件?使用 Keymob 查看和导出应用数据目录
android·ios·小程序·https·uni-app·iphone·webview
万物得其道者成3 小时前
uni-app Android 离线打包:多环境(prod/dev)配置
android·opencv·uni-app
学习3人组4 小时前
Uniapp快速上手了解
uni-app
CHU7290354 小时前
扭蛋机盲盒小程序前端功能设计及核心玩法介绍
前端·小程序
职豚求职小程序4 小时前
中华财险笔试测评题库小程序刷题职豚2026新
小程序
小鲤鱼ya4 小时前
vue3 + ts + uni-app 移动端封装图片上传添加水印
前端·typescript·uni-app·vue3
阿珊和她的猫4 小时前
小程序双线程架构:逻辑层与视图层的协同运作机制
小程序·架构
源码ym7k资源4 小时前
在线家政系统(APP+小程序)源码:为您提供专业的本地服务
小程序
2601_952013764 小时前
家政服务小程序预约上门服务维修保洁上门服务在线派单技师入驻-ym7K
小程序