微信小程序把百度地图坐标转换成腾讯地图坐标过程详解


Posted in Javascript onJuly 10, 2019

百度地图的经纬度放到腾讯地图里面解析地址,导致位置信息显示不正确,所以利用腾讯地图提供的API进行转换。
如果没有开发密钥(key),就到腾讯地图官方文档进行申请和下载qqmap-wx-jssdk.js

腾讯地图官方文档

申请步骤

微信小程序把百度地图坐标转换成腾讯地图坐标过程详解

填写信息

微信小程序把百度地图坐标转换成腾讯地图坐标过程详解

wxml代码

<map id='map' longitude="{{longitude}}" latitude="{{latitude}}" markers="{{markers}}" show-location bindmarkertap='map_details' scale="16" bindtap='open_map_details'>
 </map>

js代码

// 引入SDK核心类
var QQMapWX = require('../../../utils/qqmap-wx-jssdk.js');


//百度经纬度转换腾讯经纬度
 reverseLocation: function() {
  var that = this;
  // 实例化API核心类
  var demo = new QQMapWX({
   key: '申请的开发密钥'
  });
  // 调用接口
  demo.reverseGeocoder({
   location: {
    latitude: that.data.latitude,
    longitude: that.data.longitude
   },
   coord_type: 3, //baidu经纬度
   success: function(res) {
    var latitude = res.result.ad_info.location.lat;
    var longitude = res.result.ad_info.location.lng;
    var markers = [{
     iconPath: '../../../images/common/location.png',
     longitude: longitude,
     latitude: latitude,
     id: "map",
    }]
    console.log(markers)
    that.setData({
     markers: markers,
     latitude: latitude,
     longitude: longitude
    })
   },
   fail: function(error) {    
    console.error(error);   
   },
   complete: function(res) {    
    console.log(res); 
   }
  });
 },

微信小程序把百度地图坐标转换成腾讯地图坐标过程详解

日常笔记!个人项目亲测可行。

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

Javascript 相关文章推荐
深入分析js中的constructor和prototype
Apr 07 Javascript
Jquery 改变radio/checkbox选中状态,获取选中的值(示例代码)
Dec 12 Javascript
JavaScript中判断变量是数组、函数或是对象类型的方法
Feb 25 Javascript
javascript清空table表格的方法
May 14 Javascript
JavaScript使用位运算符判断奇数和偶数的方法
Jun 01 Javascript
基于jquery实现人物头像跟随鼠标转动
Aug 23 Javascript
jQuery滚动新闻实现代码
Jun 26 Javascript
纯js实现图片匀速淡入淡出效果
Aug 22 Javascript
AngularJs用户登录问题处理(交互及验证、阻止FQ处理)
Oct 26 Javascript
图文介绍Vue父组件向子组件传值
Feb 17 Javascript
详解Vue基于vue-quill-editor富文本编辑器使用心得
Jan 03 Javascript
three.js 制作动态二维码的示例代码
Jul 31 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
Jul 10 #jQuery
JavaScript实现的滚动公告特效【基于jQuery】
Jul 10 #jQuery
JavaScript前端页面搜索功能案例【基于jQuery】
Jul 10 #jQuery
JS根据Unix时间戳显示发布时间是多久前【项目实测】
Jul 10 #Javascript
JS把字符串格式的时间转换成几秒前、几分钟前、几小时前、几天前等格式
Jul 10 #Javascript
JS将时间秒转换成天小时分钟秒的字符串
Jul 10 #Javascript
js Array.slice的8种不同用法示例
Jul 10 #Javascript
You might like
Zend公司全球首推PHP认证
2006/10/09 PHP
Codeigniter实现智能裁剪图片的方法
2014/06/12 PHP
PHP大神的十大优良习惯
2016/09/14 PHP
文本链接逐个出现的js脚本
2007/12/12 Javascript
一个JS小玩意 几个属性相加不能超过一个特定值.
2009/09/29 Javascript
js实现屏蔽默认快捷键调用自定义事件示例
2013/06/18 Javascript
jquery封装的对话框简单实现
2013/07/21 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
jquery操作select详解(取值,设置选中)
2014/02/07 Javascript
JavaScript中的逻辑判断符&amp;&amp;、||与!介绍
2014/12/31 Javascript
JavaScript的Backbone.js框架的一些使用建议整理
2016/02/14 Javascript
浅谈angular4实际项目搭建总结
2017/12/01 Javascript
详解webpack require.ensure与require AMD的区别
2017/12/13 Javascript
webpack里使用jquery.mCustomScrollbar插件的方法
2018/05/30 jQuery
详解可以用在VS Code中的正则表达式小技巧
2019/05/14 Javascript
Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩)
2019/10/23 Javascript
Angular8 实现table表格表头固定效果
2020/01/03 Javascript
elementui更改el-dialog关闭按钮的图标d的示例代码
2020/08/04 Javascript
Python smallseg分词用法实例分析
2015/05/28 Python
深入理解Python装饰器
2016/07/27 Python
利用Pytorch实现简单的线性回归算法
2020/01/15 Python
浅谈Pytorch torch.optim优化器个性化的使用
2020/02/20 Python
Django+boostrap 美化admin后台的操作
2020/03/11 Python
matplotlib 画双轴子图无法显示x轴的解决方法
2020/07/27 Python
美国成衣女装品牌:CHICO’S
2016/09/19 全球购物
大学生就业自我鉴定
2013/10/26 职场文书
学校采购员岗位职责
2014/01/02 职场文书
吸烟检讨书2000字
2014/02/13 职场文书
社会治安综合治理管理责任书
2014/04/16 职场文书
团日活动总结模板
2014/06/25 职场文书
我们的节日国庆活动方案
2014/08/19 职场文书
员工试用期自我评价
2014/09/18 职场文书
员工辞退通知书
2015/04/17 职场文书
如何写观后感
2015/06/19 职场文书
百日宴上的祝酒词
2015/08/10 职场文书
不想升级Win11?教你彻底锁定老版Windows系统的方法(附下载地址)
2022/09/23 数码科技