问题:后端给的gps,前端用高德地图渲染,绘制出来的轨迹有偏移,没有在道路上

1.坐标系转换方法一

地址:https://blog.csdn.net/weixin_34049948/article/details/90619608

var WGS84_to_GCJ02 = function() {}
WGS84_to_GCJ02.prototype.a = 6378245.0;
WGS84_to_GCJ02.prototype.ee = 0.00669342162296594323;
WGS84_to_GCJ02.prototype.transform = function(wgLat, wgLon) {
if (this.outOfChina(wgLat, wgLon)) {
return [wgLat, wgLon];
}
dLat = this.transformLat(wgLon - 105.0, wgLat - 35.0);
dLon = this.transformLon(wgLon - 105.0, wgLat - 35.0);
radLat = wgLat / 180.0 * Math.PI;
magic = Math.sin(radLat);
magic = 1 - this.ee * magic * magic;
sqrtMagic = Math.sqrt(magic);
dLat = (dLat * 180.0) / ((this.a * (1 - this.ee)) / (magic * sqrtMagic) * Math.PI);
dLon = (dLon * 180.0) / (this.a / sqrtMagic * Math.cos(radLat) * Math.PI);
mgLat = wgLat + dLat;
mgLon = wgLon + dLon;
return [mgLat, mgLon];
};
WGS84_to_GCJ02.prototype.outOfChina = function(lat, lon) {
if (lon < 72.004 || lon > 137.8347)
return true;
if (lat < 0.8293 || lat > 55.8271)
return true;
return false;
};
WGS84_to_GCJ02.prototype.transformLat = function(x, y) {
var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x));
ret += (20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(y * Math.PI) + 40.0 * Math.sin(y / 3.0 * Math.PI)) * 2.0 / 3.0;
ret += (160.0 * Math.sin(y / 12.0 * Math.PI) + 320 * Math.sin(y * Math.PI / 30.0)) * 2.0 / 3.0;
return ret;
};
WGS84_to_GCJ02.prototype.transformLon = function(x, y) {
var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
ret += (20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(x * Math.PI) + 40.0 * Math.sin(x / 3.0 * Math.PI)) * 2.0 / 3.0;
ret += (150.0 * Math.sin(x / 12.0 * Math.PI) + 300.0 * Math.sin(x / 30.0 * Math.PI)) * 2.0 / 3.0;
return ret;
};

调用:

let zuobiao = new WGS84_to_GCJ02().transform(30.897954, 105.045820);
console.log('WGS-84转为GCJ-02坐标',zuobiao[0].toFixed(6))

方法二:GPS转为高德坐标

网址:https://blog.csdn.net/qq_42704540/article/details/110440442

var GPS = {
PI: 3.14159265358979324,
x_pi: 3.14159265358979324 * 3000.0 / 180.0,
transformLat: function(x, y) {
var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x))
ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0
ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0
return ret
},
transformLon: function(x, y) {
var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x))
ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0
ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0
ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0
return ret
},
// 坐标转换
delta: function(lat, lon) {
var a = 6378245.0 // a: 卫星椭球坐标投影到平面地图坐标系的投影因子。
var ee = 0.00669342162296594323 // ee: 椭球的偏心率。
var dLat = this.transformLat(lon - 105.0, lat - 35.0)
var dLon = this.transformLon(lon - 105.0, lat - 35.0)
var radLat = lat / 180.0 * this.PI
var magic = Math.sin(radLat)
magic = 1 - ee * magic * magic
var sqrtMagic = Math.sqrt(magic)
dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI)
dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI)
return { 'lat': dLat, 'lon': dLon }
},
// 判断是否为国外坐标
outOfChina: function(lat, lon) {
if (lon < 72.004 || lon > 137.8347) { return true }
if (lat < 0.8293 || lat > 55.8271) { return true }
return false
},
// GPS---高德
gcj_encrypt: function(wgsLat, wgsLon) {
if (this.outOfChina(wgsLat, wgsLon)) { return { 'lat': wgsLat, 'lon': wgsLon } }
var d = this.delta(wgsLat, wgsLon)
return { 'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon }
}
}

调用:

 let gps = new WGS84_to_GCJ02().transform(Number(item.latitude),Number(item.longitude))arr.push([(gps[1].toFixed(6))*1,(gps[0].toFixed(6))*1]);// arr.push([item.longitude,item.latitude])// newData.push([item.longitude,item.latitude])console.log('数据循环',gps);

效果:

有原创若看到,可以私聊我哟,转发请注明原创

gps坐标转换为高德坐标相关推荐

  1. JAVA 拍照 exif GPS_读取图片EXIF块中GPS信息,转换为高德地图API坐标

    最近两天做了一个需求,从APP端上传的照片信息里面读取出GPS位置信息,然后翻译成可读的地点信息. 总结一下,分为三步: (1)提取图片中的GPS信息,使用到了metadata-extractor; ...

  2. 高德地图轨迹回放、点的弹跳效果、浏览器环境监测、设置地图的主题样式、GPS坐标转为高德坐标、地图加载提示、地图DOM事件、修改图层等API接口

    1.轨迹回放 https://lbs.amap.com/api/javascript-api/example/marker/replaying-historical-running-data 2.点的 ...

  3. 百度地图坐标转换为墨卡托坐标

    百度地图坐标转换为墨卡托坐标 转换思路 百度坐标系 (BD-09)首先转换为火星坐标系 (GCJ-02) ,根据gci坐标的经纬度再转成墨卡托坐标: 功能代码 /** * * 火星坐标系 (GCJ-0 ...

  4. 经纬度坐标转换为工程坐标

    1. 绪论 在施工和工程测量时,经常需要将GPS坐标转换为工程中所使用的坐标.在Bing上检索到的类似问题,基本描述为两个坐标系的转换,但实际上并非如此. 本文将详细解释转换过程和转换方法. 1.1 ...

  5. Matlab快速将影像的二维坐标转换为经纬度坐标

    一般使用 [lat, lon] = pix2latlon(R,row,col) 逐个将影像的二维坐标转换为经纬度坐标,但这样用到双重循环,运行较慢,代码如下: [A, RA] = readgeoras ...

  6. java gps经纬度坐标转高德坐标_RN中Geolocation的经纬度坐标转换为高德地图坐标

    Geolocation经纬度转换为高德地图经纬度方法 直接调用如下GPS. gcj_encrypt(lat, lon)就行了 var GPS = { PI : 3.14159265358979324, ...

  7. 国标GPS坐标转高德坐标java

    import java.util.HashMap; import java.util.Map;/*** 国标GPS转高德坐标系方法* @Author: anshen* @Date: 2022/6/28 ...

  8. 百度地图API gps坐标转换为百度坐标

    百度地图API官网示例 我写的例子,基于react 实现的功能: 根据点画折线 在点位置插入自定义图标 点击图标的时候显示一张图片 传递的gps坐标需要转换成百度坐标 因为坐标转换一次转换不能超过10 ...

  9. java gps经纬度坐标转高德坐标_高德经纬度转普通GPS经纬度

    # 官方API: http://lbs.amap.com/api/webservice/guide/api/convert # 坐标体系说明:http://lbs.amap.com/faq/top/c ...

最新文章

  1. C语言利用循环判断大月小月,对大月和小月进行判断
  2. 一步步学习微软InfoPath2010和SP2010--第三章节--表单设计基础:处理InfoPath布局、控件和视图(4)--控件属性功能区...
  3. i7 8700 服务器系统,i7 8700k 云服务器6
  4. PHP生成Mysql数据字典
  5. [四校联考P3] 区间颜色众数 (主席树)
  6. 用重构指导Clean Code(二):依恋情结和switch语句
  7. bzoj4152: [AMPPZ2014]The Captain
  8. 三角函数π/2转化_【高中数学说课】三角函数的诱导公式
  9. CSS3几种新的长度单位
  10. IClient for js开发之地图的加载
  11. aws消息服务器,经验分享:我们如何使用AWS构建无服务器架构 - hypertrack
  12. Eigen教程(10)之混淆
  13. 关于网页数据导入excel
  14. H5标签input标签上传文件(一)
  15. MySQL 根据身份证查找年龄段
  16. keybd_event模拟键盘输入
  17. GoLang之map底层系列二(浅显学习)
  18. cartographer CSM理解
  19. socket中的TCP编程(调用免费聊天的机器人实现自动回复)
  20. 在前端layui项目中使用ztree

热门文章

  1. 研究生、博士生全程只靠自己能否发一篇 SCI?
  2. python量化分析—对海龟交易法则的验证
  3. HighCharts结构及详细配置(中文对比)
  4. 高德地图基础控件使用 搜索定位等
  5. Vue 3.3“浪客剑心”发布
  6. 图像的谱图和图像的能量函数的构建
  7. 谷歌seo文案写作:掌握技巧,靠文章也能开启流量池
  8. Feign从http调用改成基于dubbo协议调用
  9. mysql 多表查询计算平均_MYSQL多表查询
  10. 环形网络潮流计算matlab 利用matlab编程计算任意环形网络牛拉法潮流计算程序,程序通用性强,通过修改参数