Uniapp,vue拉起地图导航(微信小程序)

news/2024/11/30 15:42:16/

Uniapp,vue拉起地图导航(微信小程序)

  • 首先 微信拉起地图导航方法需要配合获取定位度方法使用
  • 如下图

首先 微信拉起地图导航方法需要配合获取定位度方法使用

wx.getLocation()方法

  • 这个方法需要在首页调用一下
uni.getLocation({type: "wgs84", //返回可以用于 wx.openLocation 的经纬度success(res) {console.log(res);const lat = res.latitude;const lng = res.longitude;}});
  • 还需要再app.json里面加入 不然上线的时候审核不过
permission: {"scope.userLocation": {desc: "你的位置信息将用于小程序位置接口的效果展示"}},requiredPrivateInfos: ["getLocation"]
  • 然后在你点击拉起按钮方法里面写入这个wx.openLocation()方法
    切记里面的经纬度需要转成数字(Number类型)例如:
  • 按钮
<view onTap='toAddress(item)'>去这里</view>
  • 方法
toAddress(item){
//此处item是 你获取到的当前点击的那一条数据  方法里面需要用到 名称  地址 经纬度uni.openLocation({latitude: Number(lat),  //目标纬度longitude: Number(lng),  //目标经度name: item.biz_address, //名称address: item.biz_address, //地址scale: 28});
}

如下图

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

Markdown 图标 快捷键
撤销 Ctrl /⌘+Z
重做 Ctrl /⌘+Y
加粗 Ctrl /⌘+B
斜体 Ctrl /⌘+I
标题 Ctrl /⌘+Shift +H
有序列表 Ctrl /⌘+Shift +O
无序列表 Ctrl /⌘+Shift +U
待办列表 Ctrl /⌘+Shift +C
插入代码 Ctrl /⌘+Shift +K
插入链接 Ctrl /⌘+Shift +L
插入图片 Ctrl /⌘+Shift +G
查找 Ctrl /⌘+F
替换 Ctrl /⌘+G


http://www.ppmy.cn/news/593975.html

相关文章

ROS 自定义地图导航

0x00 概述 在前面的文章中&#xff0c;我们介绍如何自动导航时&#xff0c;都是基于使用gmapping或者hector_mapping创建的地图。当然使用其他的建图方法创建的地图也可以&#xff0c;但是目前为止&#xff0c;无论使用哪种建图方法。通过激光雷达或深度摄像头建立的地图仍然是…

百度地图导航

只说步骤 大牛们看着不要笑就好 主页面的布局里面就一个button <Button android:layout_width"wrap_content"android:layout_height"wrap_content"android:id"id/start_nav2_btn"android:textSize"18sp"android:padding"20d…

Cesium+Vue实战教程——地图导航

Hello&#xff0c;大家好&#xff0c;这里是在宿舍呆着&#xff0c;避免成为小阳人的GIS宇宙。要说WebGIS比较火的库当初Cesium.js了&#xff0c;基于二维三维地图展示&#xff0c;结合Threejs可以做一些炫酷的特效&#xff0c;常用于智慧城市比如智慧水利、智慧政务等等啊&…

ReactNative实现地图导航

相关源码 同志们好,我又回归了,本来是想分享Flutter相关的内容,但是好久不写文章,感觉生疏了不少,不知道从何处下笔了,所有就把草稿箱躺了快一年的内容整理一下,分享分享。这篇文章是使用最简单的方式实现地图导航的需求,那就是通过唤起手机中的导航类软件进行导航,所…

Android调用跳转百度地图、高德地图、腾讯地图进行目的地导航

Android App跳转百度地图、高德地图、腾讯地图进行目的地导航。 先放上百度、高德、腾讯地图调起API文档地址&#xff0c;有些参数不懂可以参考。 百度地图&#xff1a;http://lbsyun.baidu.com/index.php?titleuri/api/android 高德地图&#xff1a;https://lbs.amap.com/…

socketio连接失败,nginx返回502 connect() failed (111: Connection refused)

现象 我们信控平台&#xff0c;需要实时展示信号灯灯态&#xff08;红黄绿、倒计时等&#xff09; 当灯态变化时&#xff0c;前端信号机设备会通过socket协议将消息推送给我们的通信服务&#xff0c;通信服务将消息解析处理后&#xff0c;关联路口信息&#xff0c;再把信息通过…

服务主机本地系统占cpu_如何通过“服务主机:本地系统(网络受限制)”解决CPU使用率过高的问题

服务主机本地系统占cpu On some Windows 10 PCs, the “Service Host: Local System (Network Restricted)” process group in the Task Manager can use a high amount of CPU, disk, and memory resources. Here’s how to fix it. 在某些Windows 10 PC上, 任务管理器中的“…

原生安卓解决WiFi网络受限以及修改NTP服务器

一. 解决网络受限 1. 通过ADB命令的方式 先删除默认的地址&#xff1a; adb shell settings delete global captive_portal_https_url adb shell settings delete global captive_portal_http_url再修改新的地址&#xff1a; adb shell settings put global captive_portal…