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


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代码
Jan 01 Javascript
利用jquery操作select下拉列表框的代码
Jun 04 Javascript
jQuery 处理页面的事件详解
Jan 20 Javascript
JS实现的生成随机数的4个函数分享
Feb 11 Javascript
JavaScript轻松创建级联函数的方法示例
Feb 10 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
Node.js搭建小程序后台服务
Jan 03 Javascript
vue2.0实现移动端的输入框实时检索更新列表功能
May 08 Javascript
Angular 实现输入框中显示文章标签的实例代码
Nov 07 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
Dec 25 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
Apr 10 Javascript
优雅的处理vue项目异常实战记录
Jun 05 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
海贼王动画变成“真人”后,凯多神还原,雷利太帅了!
2020/04/09 日漫
解决PHP在DOS命令行下却无法链接MySQL的技术笔记
2010/12/29 PHP
三个类概括PHP的五种设计模式
2012/09/05 PHP
php 启动时报错的简单解决方法
2014/01/27 PHP
PHP中round()函数对浮点数进行四舍五入的方法
2014/11/19 PHP
php读取mssql的ntext字段返回值为空的解决方法
2014/12/30 PHP
PHP之密码加密的几种方式
2015/07/29 PHP
php DES加密算法实例分析
2019/09/18 PHP
javascript Xml增删改查(IE下)操作实现代码
2009/01/30 Javascript
js鼠标滑轮滚动事件绑定的简单实例(兼容主流浏览器)
2014/01/14 Javascript
Javascript 按位左移运算符使用介绍(
2014/02/04 Javascript
jquery实现无限分级横向导航菜单的方法
2015/03/12 Javascript
javascript显式类型转换实例分析
2015/04/25 Javascript
js实现图片轮播效果
2015/12/19 Javascript
nodejs加密Crypto的实例代码
2016/07/07 NodeJs
全屏滚动插件fullPage.js使用实例解析
2016/10/21 Javascript
JavaScript获取select中text值的方法
2017/02/13 Javascript
vue-prop父组件向子组件进行传值的方法
2018/03/01 Javascript
nodejs如何在package.json中设置多条启动命令
2020/03/16 NodeJs
Python实现的堆排序算法原理与用法实例分析
2017/11/22 Python
python实现随机森林random forest的原理及方法
2017/12/21 Python
Python Paramiko模块的使用实际案例
2018/02/01 Python
Python爬虫之正则表达式的使用教程详解
2018/10/25 Python
朴素贝叶斯Python实例及解析
2018/11/19 Python
对python pandas 画移动平均线的方法详解
2018/11/28 Python
在PyCharm中实现关闭一个死循环程序的方法
2018/11/29 Python
python多线程http压力测试脚本
2019/06/25 Python
使用Python Tkinter实现剪刀石头布小游戏功能
2020/10/23 Python
web页面录屏实现
2019/02/12 HTML / CSS
碧欧泉Biotherm加拿大官方网站:法国高端护肤品牌
2019/10/18 全球购物
机械专业应届生求职信
2013/09/21 职场文书
住房公积金接收函
2014/01/09 职场文书
小学生打架检讨书
2014/01/26 职场文书
电力公司个人求职信范文
2014/02/04 职场文书
竞争上岗演讲稿范文
2014/05/12 职场文书
医学求职自荐信
2014/06/21 职场文书