微信小程序定位当前城市的方法


Posted in Javascript onJuly 19, 2018

微信小程序定位获取当前所在城市,供大家参考,具体内容如下

1、利用微信小程序接口 wx.getLocation() 获取当前经纬度,接口。

2、拿到经纬度之后,通过微信的wx.request()请求百度地图的解析接口,传入我们获取到的经纬度,拿到当前定位的城市。

微信小程序定位当前城市的方法

Page({
 data: {
 city: ''
 },
 onLoad: function (options) { 
 this.loadInfo(); 
 },
 loadInfo: function () {
 var page = this
 wx.getLocation({
  type: 'wgs84', // 默认为 wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标 
  success: function (res) {
  // success 
  var longitude = res.longitude
  var latitude = res.latitude
  page.loadCity(longitude, latitude)
  },
  fail: function () {
  // fail 
  },
  complete: function () {
  // complete 
  }
 })
 },
 
 loadCity: function (longitude, latitude) {
 var page = this
 wx.request({
  url: 'http://api.map.baidu.com/geocoder/v2/?ak=写自己的ak&location=' + latitude + ',' + longitude + '&output=json&pois=1',
  //这里的ak 是去百度地图api获取的需要自己登陆获取一下 地址:https://lbsyun.baidu.com/index.php?title=wxjsapi
  data: {},
  header: {
  'Content-Type': 'application/json'
  },
  success: function (res) {
  // success 
  console.log(res);
  var city = res.data.result.addressComponent.city;
 
  console.log("城市为" + city)
  page.setData({ city: city });
  },
  fail: function () {
  // fail 
  },
  complete: function () {
  // complete 
  }
 })
 }
});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
深入理解JavaScript作用域和作用域链
Oct 21 Javascript
js获取html参数及向swf传递参数应用介绍
Feb 18 Javascript
jQuery获取动态生成的元素示例
Jun 15 Javascript
JavaScript检查某个function是否是原生代码的方法
Aug 20 Javascript
使用js画图之圆、弧、扇形
Jan 12 Javascript
Javascript基础教程之argument 详解
Jan 18 Javascript
果断收藏9个Javascript代码高亮脚本
Jan 06 Javascript
JavaScript代码性能优化总结(推荐)
May 16 Javascript
npm 更改默认全局路径以及国内镜像的方法
May 16 Javascript
小程序云开发获取不到数据库记录的解决方法
May 18 Javascript
微信小程序实现搜索历史功能
Mar 26 Javascript
Vue全局loading及错误提示的思路与实现
Aug 09 Javascript
微信小程序表单验证form提交错误提示效果
Jun 19 #Javascript
js中split()方法得到的数组长度问题
Jul 19 #Javascript
vue+express 构建后台管理系统的示例代码
Jul 19 #Javascript
微信小程序表单弹窗实例
Jul 19 #Javascript
vue用递归组件写树形控件的实例代码
Jul 19 #Javascript
如何理解Vue的v-model指令的使用方法
Jul 19 #Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
Jul 19 #Javascript
You might like
PHP常用代码
2006/11/23 PHP
mysql建立外键
2006/11/25 PHP
PHP教程 变量定义
2009/10/23 PHP
ThinkPHP 3.2 版本升级了哪些内容
2015/03/05 PHP
codeigniter发送邮件并打印调试信息的方法
2015/03/21 PHP
php  PATH_SEPARATOR判断当前服务器系统类型实例
2016/10/28 PHP
利用XMLHTTP传递参数在另一页面执行并刷新本页
2006/10/26 Javascript
jquery 获取表单元素里面的值示例代码
2013/07/28 Javascript
jQuery制作仿腾讯web qq用户体验桌面
2013/08/20 Javascript
初识NodeJS服务端开发入门(Express+MySQL)
2017/04/07 NodeJs
JS对象与JSON互转换、New Function()、 forEach()、DOM事件流等js开发基础小结
2017/08/10 Javascript
angularjs实现天气预报功能
2020/06/16 Javascript
Node.js 使用axios读写influxDB的方法示例
2018/10/26 Javascript
js中数组常用方法总结(推荐)
2019/04/09 Javascript
javascript事件监听与事件委托实例详解
2019/08/16 Javascript
js实现简单页面全屏
2019/09/17 Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
2019/09/24 Javascript
[03:27]《辉夜杯》线下训练营 导师CU和海涛指点迷津
2015/10/23 DOTA
[00:17]天涯墨客一技能展示
2018/08/25 DOTA
从零学Python之入门(四)运算
2014/05/27 Python
python网络编程之读取网站根目录实例
2014/09/30 Python
Django给admin添加Action的步骤详解
2019/05/01 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
pycharm配置当鼠标悬停时快速提示方法参数
2019/07/31 Python
Numpy 多维数据数组的实现
2020/06/18 Python
历史系自荐信范文
2013/12/24 职场文书
积极贯彻学习两会精神总结
2014/03/17 职场文书
政府门卫岗位职责
2014/04/29 职场文书
房屋租赁授权委托书范本
2014/09/20 职场文书
2014年财务工作总结与计划
2014/12/08 职场文书
2016三八妇女节慰问信
2015/11/30 职场文书
Python一些基本的图像操作和处理总结
2021/06/23 Python
Springboot配置suffix指定mvc视图的后缀方法
2021/07/03 Java/Android
Python Pandas数据分析之iloc和loc的用法详解
2021/11/11 Python
【海涛DOTA】D-cup邀请赛NV.cn vs DT.Love
2022/04/01 DOTA
html,css,javascript是怎样变成页面的
2023/05/07 HTML / CSS