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


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 面向对象 function类
May 13 Javascript
JavaScript开发规范要求(规范化代码)
Aug 16 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
Jul 08 Javascript
JS画线(实例代码)
Nov 20 Javascript
JS设计模式之策略模式概念与用法分析
Feb 05 Javascript
vue 实现通过手机发送短信验证码注册功能
Apr 19 Javascript
vue 自定义提示框(Toast)组件的实现代码
Aug 17 Javascript
vue2过滤器模糊查询方法
Sep 16 Javascript
浅谈webpack性能榨汁机(打包速度优化)
Jan 09 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
Mar 16 Javascript
解决layer.prompt无效的问题
Sep 24 Javascript
JS使用for in有序获取对象数据
May 19 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
PHPWind 发帖回帖Api PHP版打包下载
2010/02/08 PHP
php图片加水印原理(超简单的实例代码)
2013/01/18 PHP
用php实现选择排序的解决方法
2013/05/04 PHP
30个php操作redis常用方法代码例子
2014/07/05 PHP
php strftime函数获取日期时间(switch用法)
2018/05/16 PHP
编辑浪子版表单验证类
2007/05/12 Javascript
解析arp病毒背后利用的Javascript技术附解密方法
2007/08/06 Javascript
一个用javascript写的select支持上下键、首字母筛选以及回车取值的功能
2009/09/09 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
2011/03/28 Javascript
IE的fireEvent方法概述及应用
2013/02/22 Javascript
详解JS数组Reduce()方法详解及高级技巧
2017/08/18 Javascript
weex slider实现滑动底部导航功能
2017/08/28 Javascript
Vue中的无限加载vue-infinite-loading的方法
2018/04/08 Javascript
javascript中的闭包概念与用法实践分析
2019/07/26 Javascript
解决vue+webpack项目接口跨域出现的问题
2020/08/10 Javascript
利用React高阶组件实现一个面包屑导航的示例
2020/08/23 Javascript
解决vue项目中出现Invalid Host header的问题
2020/11/17 Javascript
使用python BeautifulSoup库抓取58手机维修信息
2013/11/21 Python
Python的批量远程管理和部署工具Fabric用法实例
2015/01/23 Python
Python切片索引用法示例
2018/05/15 Python
Django如何简单快速实现PUT、DELETE方法
2019/07/24 Python
Python3 selenium 实现QQ群接龙自动化功能
2020/04/17 Python
基于Python+QT的gui程序开发实现
2020/07/03 Python
面向新手解析python Beautiful Soup基本用法
2020/07/11 Python
关于python3.9安装wordcloud出错的问题及解决办法
2020/11/02 Python
澳大利亚家具和家居用品在线商店:Interiors Online
2018/03/05 全球购物
Nike瑞典官方网站:Nike.com (SE)
2018/11/26 全球购物
优秀共产党员先进事迹
2014/01/27 职场文书
简历中的自我评价怎么写
2014/01/29 职场文书
应届中专生自荐书范文
2014/02/13 职场文书
庆元旦活动总结
2014/07/09 职场文书
2014年党员加强作风建设思想汇报
2014/09/15 职场文书
2015年端午节活动策划书
2015/05/05 职场文书
一文搞懂如何实现Go 超时控制
2021/03/30 Python
Java新手教程之ArrayList的基本使用
2021/06/20 Java/Android
解决ObjectMapper.convertValue() 遇到的一些问题
2021/06/30 Java/Android