1、国内几种常用坐标系说明
WG-S84: GPS仪器记录的经纬度信息,Google Earth采用,Google Map中国范围外使用,高德地图中国范围外使用。
GCJ-02: 火星坐标系,中国国家测绘局制定的坐标系统,由WGS-84加密后的坐标。Google中国和搜搜地图,arcgis地图,高德地图
(在国内是不允许直接用WGS84坐标系标注的,必须经过加密后才能用。必须至少使用GCJ-02坐标系,或者使用在GCJ-02加密后再进行加密的坐标系,如百度坐标系)
BD-09:百度坐标,GCJ-02加密后的坐标系,只适用于百度地图
其他:MAPBAR:搜狗坐标系,图吧坐标等,估计也是在GCJ02基础上加密而成的,这里暂不涉及
2、下面给出前面3种坐标转换javascript算法
类命名为GPS,调用方法就是:
百度转高德:
var point=GPS.bd09_To_Gcj0236.950656,114.556607)
百度转gps:
var point=GPS.bd09_To_Gps8436.950656,114.556607)
var GPS = { PI : 3.14159265358979324, x_pi : 3.14159265358979324 * 3000.0 / 180.0, delta : function lat, lon) { var a = 6378245.0; // a: 卫星椭球坐标投影到平面地图坐标系的投影因子。 var ee = 0.00669342162296594323; // ee: 椭球的偏心率。 var dLat = this.transformLatlon - 105.0, lat - 35.0); var dLon = this.transformLonlon - 105.0, lat - 35.0); var radLat = lat / 180.0 * this.PI; var magic = Math.sinradLat); magic = 1 - ee * magic * magic; var sqrtMagic = Math.sqrtmagic); dLat = dLat * 180.0) / a * 1 - ee)) / magic * sqrtMagic) * this.PI); dLon = dLon * 180.0) / a / sqrtMagic * Math.cosradLat) * this.PI); return {'lat': dLat, 'lon': dLon}; }, //84 to 火星坐标系 GCJ-02) gps84_To_Gcj02 : function wgsLat , wgsLon ) { if this.outOfChinawgsLat, wgsLon)) return {'lat': wgsLat, 'lon': wgsLon}; var d = this.deltawgsLat, wgsLon); return {lat : wgsLat + d.lat,lon : wgsLon + d.lon}; }, //火星坐标系 GCJ-02) to 百度坐标系 BD-09) gcj02_To_Bd09:functionlat, lng) { let x_pi = 3.14159265358979324 * 3000.0 / 180.0; let x = lng; let y = lat; let z = Math.sqrtx * x + y * y) + 0.00002 * Math.siny * x_pi); let theta = Math.atan2y, x) + 0.000003 * Math.cosx * x_pi); let lngs = z * Math.costheta) + 0.0065; let lats = z * Math.sintheta) + 0.006; return {lat: lats,lon: lngs}; }, //百度坐标系 BD-09) to 火星坐标系 GCJ-02) bd09_To_Gcj02:function lat, lng) { let x_pi = 3.14159265358979324 * 3000.0 / 180.0; let x = lng - 0.0065; let y = lat - 0.006; let z = Math.sqrtx * x + y * y) - 0.00002 * Math.siny * x_pi); let theta = Math.atan2y, x) - 0.000003 * Math.cosx * x_pi); let lngs = z * Math.costheta); let lats = z * Math.sintheta); return {lat: lats,lon: lngs} }, gcj02_to_gps84:function lat, lng) { var lat = +lat; var lng = +lng; if this.outOfChinalat, lng)) { return [lng, lat] } else { var dlat = this.transformLatlng - 105.0, lat - 35.0); var dlng = this.transformLonlng - 105.0, lat - 35.0); var radlat = lat / 180.0 * PI; var magic = Math.sinradlat); magic = 1 - ee * magic * magic; var sqrtmagic = Math.sqrtmagic); dlat = dlat * 180.0) / a * 1 - ee)) / magic * sqrtmagic) * PI); dlng = dlng * 180.0) / a / sqrtmagic * Math.cosradlat) * PI); var mglat = lat + dlat; var mglng = lng + dlng; return [lng * 2 - mglng, lat * 2 - mglat] } }, gps84_To_Bd09 : function wgsLat , wgsLon ) { let point=this.gps84_To_Gcj02wgsLat,wgsLon); return this.gcj02_To_Bd09point.lat,point.lon); }, bd09_To_Gps84 : function wgsLat , wgsLon ) { let point=this.bd09_To_Gcj02wgsLat,wgsLon); return this.gcj02_to_gps84point.lat,point.lon); }, outOfChina : function lat, lon) { if lon < 72.004 || lon > 137.8347) return true; if lat < 0.8293 || lat > 55.8271) return true; return false; }, 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.sqrtMath.absx)); ret += 20.0 * Math.sin6.0 * x * this.PI) + 20.0 * Math.sin2.0 * x * this.PI)) * 2.0 / 3.0; ret += 20.0 * Math.siny * this.PI) + 40.0 * Math.siny / 3.0 * this.PI)) * 2.0 / 3.0; ret += 160.0 * Math.siny / 12.0 * this.PI) + 320 * Math.siny * 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.sqrtMath.absx)); ret += 20.0 * Math.sin6.0 * x * this.PI) + 20.0 * Math.sin2.0 * x * this.PI)) * 2.0 / 3.0; ret += 20.0 * Math.sinx * this.PI) + 40.0 * Math.sinx / 3.0 * this.PI)) * 2.0 / 3.0; ret += 150.0 * Math.sinx / 12.0 * this.PI) + 300.0 * Math.sinx / 30.0 * this.PI)) * 2.0 / 3.0; return ret; } };
调用的html示例如下:
<!DOCTYPE html> <html> <head> <title>Quick Start - Leaflet</title> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" /> <link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"> <script type="text/javascript" src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script> <script type="text/javascript" src="../lib/GPS.js"></script> <style type="text/css"> body { padding: 0; margin: 0; } html, body { height: 100%; } #mapid { height: 75%; } </style> </head> <body> <div id="mapid" style="float:left;100%;height: 100%;"> </div> <script> var point=GPS.bd09_To_Gcj0236.950656,114.556607) var mymap = L.map'mapid').setView[point.lat,point.lon], 14); this.baseLayer=L.tileLayer"http://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",{ attribution: '© 高德地图', maxZoom: 18, minZoom: 4, subdomains: "1234" }).addTomymap); L.circleMarker[point.lat,point.lon], { stroke: true, color: '#aaaaaa', weight: 1, opacity:1, fillColor: '#00E400', fillOpacity: 1, radius:10 }).addTomymap).bindPopup"<b>Hello world!</b><br />I am a popup."); </script> </body> </html>