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

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

如图：

在小程序中打开地图通过后端返回的经纬度查看位置

直接上代码：

登录后复制

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

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.

HTML

登录后复制

	// 打开地图
			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);
					}
				});
			},

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.

JS

原创作者: u_16036681 转载于: https://blog.51cto.com/u_16036681/11472420