最近项目需要采集核对 PGIS警用地图的经纬度,高德和百度这些民用地图坐标强制漂移过的,需要公式转换才能用可以看我另一篇文章(https://www.jianshu.com/p/b9a8e44ed306)
考虑了一下直接调用国家测绘局的天地图(采用CGCS2000)数据,因为天地图与警用地图坐标其实相差无几。
天地图官方演示案例可以参考:
http://lbs.tianditu.gov.cn/api/js4.0/examples.html
主要需要2个功能
1.使用名称获得坐标信息
2.使用坐标获得地理信息
直接上代码,没有学过前端,东拼西凑写的比较简陋大神勿喷。
var map;
var zoom = 12;
var geocode;
function onLoad()
{
//初始化地图对象
map=new T.Map("mapDiv");
//设置显示地图的中心点和级别
map.centerAndZoom(new T.LngLat(120.69534,27.9982),zoom=14);
//创建对象
geocode = new T.Geocoder();
map.addEventListener("click", function(e){
geocode.getLocation(e.lnglat,searchResult);
});
}
// 3.用鼠标点击地图获得详细信息
function searchResult(result)
{
if(result.getStatus() == 0)
{
// 添加点位符合
map.clearOverLays();
searchGEO(result);
// 显示点击展示的信息
document.getElementById("addressMsg").innerHTML = "详细地址:"+result.getAddress();+""
var location = result.getLocationPoint();
var html = "GPS经纬度:"+location.lng+","+location.lat+"
";
var addressComponent = result.getAddressComponent();
var html = "详细信息如下:
";
html += "此点最近地点信息:"+addressComponent.address+"
";
html += "距离此点最近poi点的距离:"+addressComponent.poi_distance+"米
";
html += "距离此点最近poi点:"+addressComponent.poi+"
";
document.getElementById("detailedAddress").innerHTML = html;
}
else
{
document.getElementById("addressMsg").innerHTML = "服务器返回状态:"+result.getStatus();
document.getElementById("detailedAddress").innerHTML = "服务器返回响应信息:"+result.getMsg();
}
}
// 2.坐标反查询设置地图
function setCenterAndZoom() {
var lng = document.getElementById("lng").value;
var lat = document.getElementById("lat").value;
map.centerAndZoom(new T.LngLat(lng, lat), zoom=17);
map.clearOverLays();
var lnglat = new T.LngLat(lng, lat);
geocode.getLocation(lnglat,searchGEO);
}
// 1.使用地理编码接口获得坐标信息
function searchGEO(result)
{
if(result.getStatus() == 0){
map.panTo(result.getLocationPoint(), 17);
//创建标注对象
var marker = new T.Marker(result.getLocationPoint());
//向地图上添加标注
map.addOverLay(marker);
// 点击出现信息窗口
var location = result.getLocationPoint();
var markerInfoWin = new T.InfoWindow(result.getAddress()+'
'+location.lng+","+location.lat);
marker.openInfoWindow(markerInfoWin);
}else{
alert(result.getMsg());
}
}
// 0.提取文本用于上面检索
function search(){
map.clearOverLays();
geocode.getPoint(document.getElementById("searchPoint").value, searchGEO);
}
1.使用地理编码获得坐标信息:
25?this.value.length:25);" value="温州市" />
2.使用坐标信息获得地理编码:
经度:25?this.value.length:25);" placeholder="120.69563">
纬度:25?this.value.length:25);" placeholder="27.99766">
3.用鼠标点击地图获得详细信息: