微信h5页面调用第三方位置导航

everfly 发布于2019-08-22 15:20 / 1778人阅读

摘要：默认为最大点击后会跳转到微信的位置页面点击右下角的导航就能拉起第三方的导航拉微信用的是的坐标有些地图用的是的坐标如果出现误差比较大可以考虑是不是传入的经纬度问题具体的可以问度娘以上希望对你有所帮助文中如果哪里写错了欢迎指出欢迎加我讨论

微信h5页面拉起第三方导航应用

需要准备的:

通过微信认证的公众号
有备案过的域名

背景:微信公众号点击菜单栏跳到h5页面,需要用到导航功能

需求:当用户点击导航按钮时,跳转到第三方app进行导航

参考:微信公众号开发文档

步骤:

在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/...

jssdk的签名权限,这个权限是由后台提供的,前端只需要把签名权限注入到wx.config中就可以了,相信用过微信其他api的这一步都可以省了

   
       ```
       wx.config({
           debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
           appId: "", // 必填，公众号的唯一标识
           timestamp: , // 必填，生成签名的时间戳
           nonceStr: "", // 必填，生成签名的随机串
           signature: "",// 必填，签名
           jsApiList: ["openLocation"] // 必填，需要使用的JS接口列表 这里填写需要用到的微信api openlocation为使用微信内置地图查看位置接口
       });
       ```

这里需要注意的地方debug在上线后要改为false,jsApiList里要填你要使用的接口,不然没有作用

给导航按钮注册点击事件,调用wx.openLocation方法

$(".btn2").click(function () {
            wx.openLocation({
                latitude: 22.545538, // 纬度，浮点数，范围为90 ~ -90
                longitude: 114.054565, // 经度，浮点数，范围为180 ~ -180。
                name: "这里填写位置名", // 位置名
                address: "位置名的详情说明", // 地址详情说明
                scale: 10, // 地图缩放级别,整形值,范围从1~28。默认为最大
            });
        })

点击后会跳转到微信的位置页面,点击右下角的导航就能拉起第三方的导航拉!

5.微信用的是gcj02的坐标,有些地图用的是wgs84的坐标,如果出现误差比较大,可以考虑是不是传入的经纬度问题,具体的可以问度娘

以上,希望对你有所帮助,文中如果哪里写错了,欢迎指出,欢迎加我QQ讨论:32319149 :)

云服务器 GPU云服务器微信内h5页面打开小程序地图导航我的位置在线 h5获取用户地理位置页面导航面包导航

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93378.html

微信h5页面调用第三方位置导航

摘要：默认为最大点击后会跳转到微信的位置页面点击右下角的导航就能拉起第三方的导航拉微信用的是的坐标有些地图用的是的坐标如果出现误差比较大可以考虑是不是传入的经纬度问题具体的可以问度娘以上希望对你有所帮助文中如果哪里写错了欢迎指出欢迎加我讨论微信h5页面拉起第三方导航应用需要准备的:通过微信认证的公众号有备案过的域名背景:微信公众号点击菜单栏跳到h5页面,需要用到导航功能需求:当用...

tinyq 2019-08-01 18:41 评论0 收藏0
Hybrid APP架构设计思路

摘要：本文将从以下几个方面阐述架构设计的一些经验和思考。原文及讨论请到通讯作为一种跨语言开发模式，通讯层是架构首先应该考虑和设计的，往后所有的逻辑都是基于通讯层展开。关于Hybrid模式开发app的好处，网络上已有很多文章阐述了，这里不展开。本文将从以下几个方面阐述Hybrid app架构设计的一些经验和思考。原文及讨论请到 github issue 通讯作为一种跨语言开发模式，通讯...

hiyayiji 2019-08-19 17:19 评论0 收藏0
微信小程序初探

摘要：在微信小程序中，要更新视图就只能修改，而视图层也只能通过事件向逻辑层传递交互信息。页面移植到微信小程序要修改的地方也还比较多，主要是标签和的交互及小程序提供的功能部分。小程序是一种不需要下载安装即可使用的应用，它实现了应用「触手可及」的梦想，用户扫一扫或搜一下即可打开应用。也体现了「用完即走」的理念，用户不用关心是否安装太多应用的问题。应用将无处不在，随时可用，但又无需安装卸载。 —...

teren 2019-08-20 13:57 评论0 收藏0