js地图绘制:
1.准备一个简单的html文件,添加一个div,其id为"mapDiv"
<div id="mapDiv" style="position:absolute;width:800px; height:500px"></div>
2.引入地图的JavaScript API文件:
<script src="http://api.tianditu.com/api?v=4.0" type="text/javascript"></script>
3.创建地图对象
var map = new T.Map('mapDiv');
4.初始化坐标点对象,确定经纬度坐标和层级
var zoom = 12;
var t = new T.LngLat(116.40769, 39.89945);
5.绘制地图
map.centerAndZoom(t, zoom);
通过经纬度查询地图位置的示例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>HELLO WORLD</title>
<script type="text/javascript" src="http://api.tianditu.com/api?v=4.0"></script>
<script>
var map; //地图对象123
var zoom = 12; //层级,值越大,地图范围越小
var lon = 116.40769; //经度
var lat = 39.89945; //纬度
var t = new T.LngLat(lon, lat);
function onLoad() {
map = new T.Map('mapDiv');
map.centerAndZoom(t, zoom);
}
function query(){
lon = document.getElementById('lon').value;
lat = document.getElementById('lat').value;
if(lon == '' || lon == null) lon = 116.40769;
if(lat == '' || lat == null) lat = 39.89945;
t = new T.LngLat(lon, lat);
map.centerAndZoom(t, zoom);
}
</script>
</head>
<body onLoad="onLoad()">
<div>
经度:<input type='text' id='lon'/>
纬度:<input type='text' id='lat'/>
<input type = 'button' value = '查询坐标点' onclick='query();'/>
</div>
<div id="mapDiv" style="position:absolute;width:800px; height:500px"></div>
</body>
</html>
地图偏移问题
坐标体系分类
在各种web端平台,或者高德、腾讯、百度上取到的坐标,都不是GPS坐标,都是GCJ-02坐标,或者自己的偏移坐标系。
比如,你在谷歌地图API,高德地图API,腾讯地图API上取到的,都是GCJ-02坐标,他们三家都是通用的,也适用于大部分地图API产品,以及他们的地图产品。
例外,百度API上取到的,是BD-09坐标,只适用于百度地图相关产品。
例外,搜狗API上取到的,是搜狗坐标,只适用于搜狗地图相关产品。
例外,谷歌地球,google earth上取到的,是GPS坐标,而且是度分秒形式的经纬度坐标。在国内不允许使用。必须转换为GCJ-02坐标。
主要分为以下几类
- GPS,WGS-84,原始坐标体系。一般用国际标准的GPS记录仪记录下来的坐标,都是GPS的坐标。很可惜,在中国,任何一个地图产品都不允许使用GPS坐标,据说是为了保密。
- GCJ-02,国测局02年发布的坐标体系。又称“火星坐标”。在中国,必须至少使用GCJ-02的坐标体系。比如谷歌,腾讯,高德都在用这个坐标体系。GCJ-02也是国内最广泛使用的坐标体系。
- 其他坐标体系。一般都是由GCJ-02进过偏移算法得到的。这种体系就根据每个公司的不同,坐标体系都不一样了。比如,百度和搜狗就使用自己的坐标体系,与其他坐标体系不兼容。
百度地图偏移的校准算法
/**
* 各地图API坐标系统比较与转换;
* WGS84坐标系:即地球坐标系,国际上通用的坐标系。设备一般包含GPS芯片或者北斗芯片获取的经纬度为WGS84地理坐标系,
* 谷歌地图采用的是WGS84地理坐标系(中国范围除外);
* GCJ02坐标系:即火星坐标系,是由中国国家测绘局制订的地理信息系统的坐标系统。由WGS84坐标系经加密后的坐标系。
* 谷歌中国地图和搜搜中国地图采用的是GCJ02地理坐标系; BD09坐标系:即百度坐标系,GCJ02坐标系经加密后的坐标系;
* 搜狗坐标系、图吧坐标系等,估计也是在GCJ02基础上加密而成的。 chenhua
*/
public class PositionUtil {
public static final String BAIDU_LBS_TYPE = "bd09ll";
public static double pi = 3.1415926535897932384626;
public static double a = 6378245.0;
public static double ee = 0.00669342162296594323;
/**
* 84 to 火星坐标系 (GCJ-02) World Geodetic System ==> Mars Geodetic System
*/
public static Gps gps84_To_Gcj02(double lat, double lon) {
if (outOfChina(lat, lon)) {
return null;
}
double dLat = transformLat(lon - 105.0, lat - 35.0);
double dLon = transformLon(lon - 105.0, lat - 35.0);
double radLat = lat / 180.0 * pi;
double magic = Math.sin(radLat);
magic = 1 - ee * magic * magic;
double sqrtMagic = Math.sqrt(magic);
dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * pi);
dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * pi);
double mgLat = lat + dLat;
double mgLon = lon + dLon;
return new Gps(mgLat, mgLon);
}
/**
* * 火星坐标系 (GCJ-02) to 84
* */
public static Gps gcj_To_Gps84(double lat, double lon) {
Gps gps = transform(lat, lon);
double lontitude = lon * 2 - gps.getWgLon();
double latitude = lat * 2 - gps.getWgLat();
return new Gps(latitude, lontitude);
}
/**
* 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换算法 将 GCJ-02 坐标转换成 BD-09 坐标
*/
public static Gps gcj02_To_Bd09(double gg_lat, double gg_lon) {
double x = gg_lon, y = gg_lat;
double z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * pi);
double theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * pi);
double bd_lon = z * Math.cos(theta) + 0.0065;
double bd_lat = z * Math.sin(theta) + 0.006;
return new Gps(bd_lat, bd_lon);
}
/**
* * 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换算法 * * 将 BD-09 坐标转换成GCJ-02 坐标
*/
public static Gps bd09_To_Gcj02(double bd_lat, double bd_lon) {
double x = bd_lon - 0.0065, y = bd_lat - 0.006;
double z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * pi);
double theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * pi);
double gg_lon = z * Math.cos(theta);
double gg_lat = z * Math.sin(theta);
return new Gps(gg_lat, gg_lon);
}
/**
* (BD-09)-->84
* @param bd_lat
* @param bd_lon
* @return
*/
public static Gps bd09_To_Gps84(double bd_lat, double bd_lon) {
Gps gcj02 = PositionUtil.bd09_To_Gcj02(bd_lat, bd_lon);
Gps map84 = PositionUtil.gcj_To_Gps84(gcj02.getWgLat(),
gcj02.getWgLon());
return map84;
}
public static boolean outOfChina(double lat, double lon) {
if (lon < 72.004 || lon > 137.8347)
return true;
if (lat < 0.8293 || lat > 55.8271)
return true;
return false;
}
public static Gps transform(double lat, double lon) {
if (outOfChina(lat, lon)) {
return new Gps(lat, lon);
}
double dLat = transformLat(lon - 105.0, lat - 35.0);
double dLon = transformLon(lon - 105.0, lat - 35.0);
double radLat = lat / 180.0 * pi;
double magic = Math.sin(radLat);
magic = 1 - ee * magic * magic;
double sqrtMagic = Math.sqrt(magic);
dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * pi);
dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * pi);
double mgLat = lat + dLat;
double mgLon = lon + dLon;
return new Gps(mgLat, mgLon);
}
public static double transformLat(double x, double y) {
double 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 * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(y * pi) + 40.0 * Math.sin(y / 3.0 * pi)) * 2.0 / 3.0;
ret += (160.0 * Math.sin(y / 12.0 * pi) + 320 * Math.sin(y * pi / 30.0)) * 2.0 / 3.0;
return ret;
}
public static double transformLon(double x, double y) {
double 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 * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(x * pi) + 40.0 * Math.sin(x / 3.0 * pi)) * 2.0 / 3.0;
ret += (150.0 * Math.sin(x / 12.0 * pi) + 300.0 * Math.sin(x / 30.0
* pi)) * 2.0 / 3.0;
return ret;
}
public static void main(String[] args) {
// 北斗芯片获取的经纬度为WGS84地理坐标 31.426896,119.496145
Gps gps = new Gps(31.426896, 119.496145);
System.out.println("gps :" + gps);
Gps gcj = gps84_To_Gcj02(gps.getWgLat(), gps.getWgLon());
System.out.println("gcj :" + gcj);
Gps star = gcj_To_Gps84(gcj.getWgLat(), gcj.getWgLon());
System.out.println("star:" + star);
Gps bd = gcj02_To_Bd09(gcj.getWgLat(), gcj.getWgLon());
System.out.println("bd :" + bd);
Gps gcj2 = bd09_To_Gcj02(bd.getWgLat(), bd.getWgLon());
System.out.println("gcj :" + gcj2);
}
}