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

来源:脚本之家  责任编辑:小易  

百度地图的经纬度放到腾讯地图里面解析地址,导致位置信息显示不正确,所以利用腾讯地图提供的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); 
   }
  });
 },

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

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

您可能感兴趣的文章:


  • 本文相关:
  • 微信小程序+腾讯地图开发实现路径规划绘制
  • 微信小程序地图(map)组件点击(tap)获取经纬度的方法
  • 微信小程序 使用腾讯地图sdk详解及实现步骤
  • 微信小程序 高德地图sdk详解及简单实例(源码下载)
  • 微信小程序 地图map详解及简单实例
  • 微信小程序 地图(map)实例详解
  • 微信小程序 地图定位简单实例
  • 详解html a标签中href和onclick用法、区别、优先级别
  • 巧用replace将文字表情替换为图片
  • 理解javascript_05_原型继承原理
  • bootstrap表单制作代码
  • javascript实现x秒后自动跳转到一个页面
  • 将json转换成struts参数的方法
  • 多浏览器兼容性比较好的复制到剪贴板的js代码
  • swfobject 2.1以上版本语法介绍
  • js html时钟制作代码分享
  • 用javascript来美化html的select标签的下拉列表效果
  • 免责声明 - 关于我们 - 联系我们 - 广告联系 - 友情链接 - 帮助中心 - 频道导航
    Copyright © 2017 www.zgxue.com All Rights Reserved