マップを開発するときに最も厄介なことは、マップ ツールとデータ ソースの座標系が異なるとオフセットが発生し、さらにはエラーが発生することです。以下は、いくつかのマップ座標変換の概要です。1 つのファイルですべての状況を直接処理できます。
1. 地図座標系の分類
一般的な地図テクノロジー: openlayers、セシウム、Amap、Baidu など。異なるマップ フレーム マップの座標系はわずかに異なります。
-
WGS84 (GPS): 一般に、国際標準 GPS デバイスから取得される座標は WGS84 であり、ArcGIS や Bing のベースマップなどの国際地図プロバイダーによって使用される座標系は WGS84 座標系です。
-
GCJ02: 2002 年に国家測量局によって発表された座標系。「火星座標」とも呼ばれます。中国では、WGS84 を直接使用することはできず、国家測量地図局による暗号化が必要です。たとえば、Google China、AutoNavi、Tencent はすべてこの座標系を使用しています。
-
BD09 Baidu標準、暗号化アルゴリズムが異なります。
以下はAmapの座標変換のためのメソッドのカプセル化です。
export default class CoorsOffset {
constructor () {
this.x_pi = (3.14159265358979324 * 3000.0) / 180.0;
this.pi = 3.14159265358979324;
this.a = 6378245.0;
this.ee = 0.00669342162296594323;
}
/**
* 百度坐标系 (BD-09) 与 火星坐标系 (GCJ-02)的转换
* 即 百度 转 谷歌、高德
* @param {*} DBLon
* @param {*} DBLat
* @returns {*[longitude, latitude]}
*/
bd09togcj02 = (DBLon, DBLat) => {
const x = DBLon - 0.0065;
const y = DBLat - 0.006;
const z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi);
const theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * this.x_pi);
const lon = z * Math.cos(theta);
const lat = z * Math.sin(theta);
return [lon, lat];
}
/**
* 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换
* 即谷歌、高德 转 百度
* @param lng
* @param lat
* @returns {*[longitude, latitude]}
*/
gcj02tobd09 = (lng, lat) => {
const z = Math.sqrt(lng * lng + lat * lat) + 0.00002 * Math.sin(lat * this.x_pi);
const theta = Math.atan2(lat, lng) + 0.000003 * Math.cos(lng * this.x_pi);
const BDLng = z * Math.cos(theta) + 0.0065;
const DBLat = z * Math.sin(theta) + 0.006;
return [BDLng, DBLat];
}
/**
* WGS84转GCj02
* @param lng
* @param lat
* @returns {*[longitude, latitude]}
*/
wgs84togcj02 = (lng, lat) => {
const radlat = (lat / 180.0) * this.pi;
const magic = 1 - this.ee * Math.sin(radlat) * Math.sin(radlat);
const sqrtmagic = Math.sqrt(magic);
let dlat = this.transformlat(lng - 105.0, lat - 35.0);
let dlng = this.transformlng(lng - 105.0, lat - 35.0);
dlat = (dlat * 180.0) / (((this.a * (1 - this.ee)) / (magic * sqrtmagic)) * this.pi);
dlng = (dlng * 180.0) / ((this.a / sqrtmagic) * Math.cos(radlat) * this.pi);
let mglat = lat + dlat;
let mglng = lng + dlng;
return [mglng, mglat];
}
/**
* GCJ02 转换为 WGS84
* @param lng
* @param lat
* @returns {*[longitude, latitude]}
*/
gcj02towgs84 = (lng, lat) => {
var dlat = this.transformlat(lng - 105.0, lat - 35.0);
var dlng = this.transformlng(lng - 105.0, lat - 35.0);
const radlat = (lat / 180.0) * this.pi;
const magic = 1 - this.ee * Math.sin(radlat) * Math.sin(radlat);
const sqrtmagic = Math.sqrt(magic);
dlat = (dlat * 180.0) / (((this.a * (1 - this.ee)) / (magic * sqrtmagic)) * this.pi);
dlng = (dlng * 180.0) / ((this.a / sqrtmagic) * Math.cos(radlat) * this.pi);
const mglat = lat + dlat;
const mglng = lng + dlng;
return [lng * 2 - mglng, lat * 2 - mglat];
}
transformlat = (lng, lat) => {
let ret = -100.0 + 2.0 * lng + 3.0 * lat + 0.2 * lat * lat + 0.1 * lng * lat + 0.2 * Math.sqrt(Math.abs(lng));
ret += (20.0 * Math.sin(6.0 * lng * this.pi) + 20.0 *Math.sin(2.0 * lng * this.pi)) * (2.0 / 3.0);
ret += (20.0 * Math.sin(lat * this.pi) + 40.0 * Math.sin((lat / 3.0) * this.pi)) * (2.0 / 3.0);
ret += (160.0 * Math.sin((lat / 12.0) * this.pi) + 320 * Math.sin((lat * this.pi) / 30.0)) * (2.0 / 3.0);
return ret;
}
transformlng = (lng, lat) => {
let ret = 300.0 + lng + 2.0 * lat + 0.1 * lng * lng + 0.1 * lng * lat + 0.1 * Math.sqrt(Math.abs(lng));
ret += (20.0 * Math.sin(6.0 * lng * this.pi) + 20.0 * Math.sin(2.0 * lng * this.pi)) * (2.0 / 3.0);
ret += (20.0 * Math.sin(lng * this.pi) + 40.0 * Math.sin((lng / 3.0) * this.pi)) * (2.0 / 3.0);
ret += (150.0 * Math.sin((lng / 12.0) * this.pi) + 300.0 * Math.sin((lng / 30.0) * this.pi)) * (2.0 / 3.0);
return ret;
}
}
2. セシウム三次元マップでよく使われる座標分類
- WGS84 座標: 経度および緯度の座標。座標の原点は、経度範囲 [-180, 180]、緯度範囲 [-90, 90] です。
- WGS84 ラジアン座標 (地図作成): セシウムの地理座標単位はデフォルトでラジアン系になります。
- デカルト空間直交座標 (Cartesian3): ワールド座標、原点は楕円体の中心、座標 (x、y、z)
- ・画面座標(Cartesian2):平面直交座標系、二次元直交座標系、座標は(x,y)です。
以下はセシウムマップ座標変換のためのメソッドのカプセル化です。
/**
* 坐标转换 84转笛卡尔
* @param {Position} position 位置
* @param {number} alt 高度
* @returns {any} 笛卡尔坐标
*/
transformWGS84ToCartesian = (position, alt = 0) => (position ?
Cesium.Cartesian3.fromDegrees(
position.lon,
position.lat,
alt || position.alt,
Cesium.Ellipsoid.WGS84
) :
Cesium.Cartesian3.ZERO)
/**
* 坐标转换 笛卡尔转84
* @param {Object} cartesian 三维位置坐标
* @return {Object} {lon,lat,alt} 地理坐标
*/
transformCartesianToWGS84 = (cartesian) => {
const ellipsoid = Cesium.Ellipsoid.WGS84;
const cartographic = ellipsoid.cartesianToCartographic(cartesian);
return {
lon: Cesium.Math.toDegrees(cartographic.longitude),
lat: Cesium.Math.toDegrees(cartographic.latitude),
alt: cartographic.height,
};
}
/**
* 84坐标转弧度坐标
* @param {Object} position wgs84
* @return {Object} Cartographic 弧度坐标
*/
transformWGS84ToCartographic = (position) => (position ?
Cesium.Cartographic.fromDegrees(
position.lon || position.lon,
position.lat,
position.alt
) :
Cesium.Cartographic.ZERO)
/**
* 经纬度转Cartesian2。
* 注意这里的 Cartesian2 是屏幕坐标,不能直接使用 Cartesian2.fromCartesian3
* @param {number} lon 经度
* @param {number} lat 纬度
* @returns {void}
*/
lonLatToCartesian2 = (lon: number, lat: number): any => {
const Cartesian3Result = Cesium.Cartesian3.fromDegrees(lon, lat);
const Cartesian2Result = Cesium.SceneTransforms.wgs84ToWindowCoordinates(this.scene, Cartesian3Result);
return Cartesian2Result;
}