微信小程序实现打开内置地图功能【附源码下载】


Posted in Javascript onDecember 07, 2017

本文实例讲述了微信小程序实现打开内置地图功能。分享给大家供大家参考,具体如下:

1、效果展示

微信小程序实现打开内置地图功能【附源码下载】

2、关键代码

index.wxml布局文件代码

<button type="default" bindtap="openMap">打开地图</button>

index.js逻辑文件代码

Page({
 openMap:function(){
  wx.getLocation({
   type: 'gcj02', // 默认为 wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
   success: function(res){
    // success
    wx.openLocation({
     latitude: res.latitude, // 纬度,范围为-90~90,负数表示南纬
     longitude: res.longitude, // 经度,范围为-180~180,负数表示西经
     scale: 28, // 缩放比例
    })
   }
  })
 }
})

这里bindtap="openMap"绑定的openMap函数中调用wx.openLocation函数获取本机经纬度信息。

更多关于wx.openLocation函数详细介绍可参考官网 https://mp.weixin.qq.com/debug/wxadoc/dev/api/location.html

3、源代码点击此处本站下载

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
javascript实现动态CSS换肤技术的脚本
Jun 29 Javascript
jquery ui resizable bug解决方法
Oct 26 Javascript
解决jQuery动态获取手机屏幕高和宽的问题
May 07 Javascript
js密码强度检测
Jan 07 Javascript
js中json处理总结之JSON.parse
Oct 14 Javascript
JS函数修改html的元素内容,及修改属性内容的方法
Oct 28 Javascript
实现easyui的datagrid导出为excel的示例代码
Nov 10 Javascript
WEB开发之注册页面验证码倒计时代码的实现
Dec 15 Javascript
Angular2-primeNG文件上传模块FileUpload使用详解
Jan 14 Javascript
AngularJs导出数据到Excel的示例代码
Aug 11 Javascript
Vue指令v-for遍历输出JavaScript数组及json对象的常见方式小结
Feb 11 Javascript
Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】
May 29 jQuery
js实现关闭网页出现是否离开提示
Dec 07 #Javascript
JavaScrip关于创建常量的知识点
Dec 07 #Javascript
浅谈vue自定义全局组件并通过全局方法 Vue.use() 使用该组件
Dec 07 #Javascript
微信小程序swiper组件用法实例分析【附源码下载】
Dec 07 #Javascript
jQuery实现简单的下拉菜单导航功能示例
Dec 07 #jQuery
vue中路由参数传递可能会遇到的坑
Dec 07 #Javascript
浅谈AngularJs 双向绑定原理(数据绑定机制)
Dec 07 #Javascript
You might like
汇总PHPmailer群发Gmail的常见问题
2016/02/24 PHP
XENON基于JSON变种
2010/07/27 Javascript
基于JQuery的简单实现折叠菜单代码
2010/09/15 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
2011/12/01 Javascript
关于JavaScript中原型继承中的一点思考
2012/07/25 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
2013/06/21 Javascript
控制文字内容的显示与隐藏示例
2014/06/11 Javascript
微信js-sdk上传与下载图片接口用法示例
2016/10/12 Javascript
利用jQuery解析获取JSON数据
2017/04/08 jQuery
nodejs获取微信小程序带参数二维码实现代码
2017/04/12 NodeJs
Node.js中看JavaScript的引用
2017/04/22 Javascript
JQuery实现定时刷新功能代码
2017/05/09 jQuery
Vue的watch和computed方法的使用及区别介绍
2018/09/06 Javascript
js 动态校验开始结束时间的实现代码
2020/05/25 Javascript
OpenLayers3实现图层控件功能
2020/09/25 Javascript
手写Vue源码之数据劫持示例详解
2021/01/04 Vue.js
vue自定义组件实现双向绑定
2021/01/13 Vue.js
[00:47]TI7不朽珍藏III——沙王不朽展示
2017/07/15 DOTA
python读取excel表格生成erlang数据
2017/08/26 Python
python3.5 tkinter实现页面跳转
2018/01/30 Python
python直接获取API传递回来的参数方法
2018/12/17 Python
Python列表与元组的异同详解
2019/07/02 Python
django中使用事务及接入支付宝支付功能
2019/09/15 Python
python线程安全及多进程多线程实现方法详解
2019/09/27 Python
Flask和pyecharts实现动态数据可视化
2020/02/26 Python
python3实现名片管理系统(控制台版)
2020/11/29 Python
详解numpy1.19.4与python3.9版本冲突解决
2020/12/15 Python
CSS3动画之利用requestAnimationFrame触发重新播放功能
2019/09/11 HTML / CSS
CSS实现圆形放大镜狙击镜效果 只有圆圈里的放大
2012/12/10 HTML / CSS
爱尔兰橄榄球店:Irish Rugby Store
2019/12/05 全球购物
高校自主招生自荐信
2013/12/09 职场文书
优秀通讯员事迹材料
2014/01/28 职场文书
大学生村官考核材料
2014/05/23 职场文书
介绍信的写法
2015/01/31 职场文书
2015年转正工作总结范文
2015/04/02 职场文书
2015初中生物教研组工作总结
2015/07/21 职场文书