微信小程序中进行地图导航功能的实现方法


Posted in Javascript onJune 29, 2018

前段时间一直都在做小程序做了两个月了,其中对于小程序还是有很不理解的地方看着一些大企业的小程序自己模仿其实还是有一些难度的,我觉得学习小程序看一遍文档是不够的我们要做的是看别人的例子对着文档一一对照!

      好这次我们来开始我们的开发,其实微信小程序里面是不能导航的,原因是小程序的代码最多只能有1M,他的运行内存只能有10M,一个区域地图下载下来就不止1M了所以在应用内我们无法做到导航的,但是应用外呢!

     我问过很多做安卓和IOS的同僚一般如果导航这个功能不是很重要的话就会放到应用外来做这个功能,但是高德地图和腾讯地图都会有响应的SDK,可是小程序不同,尽管上面也有小程序的SDK但是也是没有用的,那么我们解决应用外调用的呢?

    这就需要我们重新认识一下位置的API

wx.getLocation({
 type: 'gcj02', //返回可以用于wx.openLocation的经纬度
 success: function(res) {
  var latitude = res.latitude
  var longitude = res.longitude
  wx.openLocation({
   latitude: latitude,
   longitude: longitude,
   name:"花园桥肯德基",
   scale: 28
  })
 }
})

   然后就会出现下图

微信小程序中进行地图导航功能的实现方法

     点击绿圆点点右下角的

微信小程序中进行地图导航功能的实现方法

   然后是

微信小程序中进行地图导航功能的实现方法

  最后就到了高德啦!

  微信小程序中进行地图导航功能的实现方法

总结

以上所述是小编给大家介绍的微信小程序中进行地图导航功能的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript操作文本框readOnly
May 15 Javascript
javascript 函数调用的对象和方法
Jul 01 Javascript
DWR实现模拟Google搜索效果实现原理及代码
Jan 30 Javascript
js格式化货币数据实现代码
Sep 04 Javascript
浅析js设置控件的readonly与enabled属性问题
Dec 25 Javascript
JavaScript利用正则表达式去除日期中的“-”
Jul 01 Javascript
jQuery往返城市和日期查询实例讲解
Oct 09 Javascript
jQuery替换节点用法示例(使用replaceWith方法)
Sep 08 Javascript
jquery Ajax 全局调用封装实例详解
Jan 16 Javascript
JS 实现随机验证码功能
Feb 15 Javascript
vue iView 上传组件之手动上传功能
Mar 16 Javascript
Angular父组件调用子组件的方法
Apr 02 Javascript
Vue表单demo v-model双向绑定问题
Jun 29 #Javascript
vue底部加载更多的实例代码
Jun 29 #Javascript
使用vue打包时vendor文件过大或者是app.js文件很大的问题
Jun 29 #Javascript
vue项目打包后打开页面空白解决办法
Jun 29 #Javascript
详解Vue webapp项目通过HBulider打包原生APP
Jun 29 #Javascript
Vue下路由History模式打包后页面空白的解决方法
Jun 29 #Javascript
详解Vue微信授权登录前后端分离较为优雅的解决方案
Jun 29 #Javascript
You might like
js 分栏效果实现代码
2009/08/29 Javascript
JS打开新窗口的2种方式
2013/04/18 Javascript
jquery 获取 outerHtml 包含当前节点本身的代码
2014/10/30 Javascript
js实现从数组里随机获取元素
2015/01/12 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
2016/01/04 Javascript
Node.js实现数据推送
2016/04/14 Javascript
ReactNative页面跳转实例代码
2016/09/27 Javascript
js学习之----深入理解闭包
2016/11/21 Javascript
客户端(vue框架)与服务器(koa框架)通信及服务器跨域配置详解
2017/08/26 Javascript
JavaScript实现的DOM树遍历方法详解【二叉DOM树、多叉DOM树】
2018/05/07 Javascript
vue 获取及修改store.js里的公共变量实例
2019/11/06 Javascript
微信小程序获取当前位置和城市名
2019/11/13 Javascript
JS中多层次排序算法的实现代码
2021/01/06 Javascript
python操作MySQL数据库的方法分享
2012/05/29 Python
Python实现的人工神经网络算法示例【基于反向传播算法】
2017/11/11 Python
python解析html提取数据,并生成word文档实例解析
2018/01/22 Python
python爬虫获取淘宝天猫商品详细参数
2020/06/23 Python
PyQt5实现拖放功能
2018/04/25 Python
python用fsolve、leastsq对非线性方程组求解
2018/12/15 Python
python多线程与多进程及其区别详解
2019/08/08 Python
Python搭建代理IP池实现检测IP的方法
2019/10/27 Python
python  ceiling divide 除法向上取整(或小数向上取整)的实例
2019/12/27 Python
基于Tensorflow使用CPU而不用GPU问题的解决
2020/02/07 Python
Python实现Wordcloud生成词云图的示例
2020/03/30 Python
浅谈Python中文件夹和python package包的区别
2020/06/01 Python
python中绕过反爬虫的方法总结
2020/11/25 Python
特步官方商城:Xtep
2017/03/21 全球购物
爱尔兰灯和灯具网上商店:Lights.ie
2018/03/26 全球购物
新浪网技术部笔试题
2016/08/26 面试题
医学专业毕业生个人的求职信
2013/12/04 职场文书
初三学习计划书范文
2014/04/30 职场文书
2014年感恩节活动策划方案
2014/10/06 职场文书
村级干部党员公开承诺事项
2015/05/04 职场文书
捐款仪式主持词
2015/07/04 职场文书
学生早退检讨书(范文)
2019/08/19 职场文书
Golang 链表的学习和使用
2022/04/19 Golang