基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标

 更新时间:2016年01月22日 10:55:10   作者:云是风的梦  
本文给大家介绍javascript实现高德地图和百度地图提取行政区边界经纬度坐标的相关知识,本文实用性非常高,代码简单易懂,需要的朋友参考下吧

前言

近来由于工作需要,需要提取某些城市的经纬度坐标,稍微搜索了一下,发现百度地图和高德地图都提供了相关的函数和例子.那么剩余的工作也就比较简单了,保存坐标,然后转换为WGS坐标,这样才能和现有的GPS数据以及地图匹配.

主要问题和解决方法

本地保存文件跨浏览器支持

由于安全的原因,JavaScript本地保存文件的方式通常都只有IE支持的ActiveXObject/Open方法,每次都要提示不安全和允许运行,非常麻烦.好在其他浏览器目前都支持<a>标签实现文件下载的方法.经测试最新的Google Chrome, Mozilla Firefox,百度浏览器,360浏览器下都可以运行.不说废话,直接上代码:

function Download() {
// IE
if(/msie/i.test(navigator.userAgent)) {
var w = window.open("", "导出", "height=0,width=0,toolbar=no,menubar=no,scrollbars=no,resizable=on,location=no,status=no");
var filename = document.getElementById("filename").value ;
var content = document.getElementById("content").value;
w.document.charset = "UTF-8";
w.document.write(content);
w.document.execCommand("SaveAs", false, filename+'.txt');
w.close();
}
// Firefox/Chrome/Safari/Opera
else {
var filename = document.getElementById("filename").value ;
var content = document.getElementById("content").value;
str = encodeURIComponent(content); 
document.getElementById("SaveChrome").download = filename+'.txt'; 
var aLink = document.getElementById("SaveChrome") ; 
aLink.href = "data:text/csv;charset=utf-8,"+str; 
aLink.click(); 
}
}

经纬度转换

这个话题感兴趣的朋友可以自己搜索火星坐标相关转换,精度在1m范围的网上提供有服务可以免费使用.自写程序经验证精度在6m 以内.

百度地图方法

关键函数是 BMap.Boundary() 生成的类,调用它的方法get就可以通过名称获得县或市级以上的行政区域.

function getBoundary() {
var bdary = new BMap.Boundary();
var name = document.getElementById("districtName").value;
bdary.get(name, function (rs) { //获取行政区域
var fileName = "";
var newFileObject = fso.CreateTextFile(folderName + "\\" + name + ".txt", true);
map.clearOverlays(); //清除地图覆盖物
var count = rs.boundaries.length; //行政区域的点有多少个
for (var i = 0; i < count; i++) {
var ply = new BMap.Polygon(rs.boundaries[i], { strokeWeight: 2, strokeColor: "#ff0000" }); //建立多边形覆盖物
map.addOverlay(ply); //添加覆盖物
map.setViewport(ply.getPath()); //调整视野
}
newFileObject.write(rs.boundaries[0]);
newFileObject.Close();
});
} 

高德地图

关键代码通过阅读示例文件可以发现在下拉列表返回里面有边界值的出现.

amapAdcode.search = function(adcodeLevel, keyword, selectId) {//查询行政区划列表并生成相应的下拉列表
var me = this;
if (adcodeLevel == 'district'||adcodeLevel == 'city') {//第三级时查询边界点
this._district.setExtensions('all');
} else {
this._district.setExtensions('base');
}
this._district.setLevel(adcodeLevel); //行政区级别
this._district.search(keyword, function(status, result) {//注意,api返回的格式不统一,在下面用三个条件分别处理
var districtData = result.districtList[0];
if (districtData.districtList) {
me.createSelectList(selectId, districtData.districtList);
} else if (districtData.districts) {
me.createSelectList(selectId, districtData.districts);
} else {
document.getElementById(selectId).innerHTML = '';
}
map.setCenter(districtData.center);
me.clearMap();
me.addPolygon(districtData.boundaries); 

其中的districtData.boundaries 就是我们需要的.调试了一下,大胆猜测果然是实现了Tostring() 方法的一个对象.
"104.639106,26.863388,104.644771,26.861842,104.64767,26.854997,104.647748..." 很明显的就是我们需要的gcj坐标.

总结

至此,基本也就没有什么问题了,剩余的工作就是解析得到的文件.需要提取全国的数据也就是循环读取全国城市列表文件了.(通常搜索cityname,电脑里面都会找到的,原因,呵呵,猜测是迅雷,QQ之类的IP定位需要吧.)

重要的一点,推荐使用高德地图,原因就是百度地图得到的行政规划有问题,不包含县级市.最典型的就是贵州省,很多地市都是分离的,是带岛或洞的复杂多边形.百度在这里完败.关于怎么处理这里复杂的多边形以支持在MapWinGIS显示和处理,下次会写一篇笔记.

相关文章

  • JS+DIV实现鼠标划过切换层效果的方法

    JS+DIV实现鼠标划过切换层效果的方法

    这篇文章主要介绍了JS+DIV实现鼠标划过切换层效果的方法,涉及javascript鼠标事件及页面元素操作的相关技巧,需要的朋友可以参考下
    2015-05-05
  • Mac/Windows下如何安装Node.js

    Mac/Windows下如何安装Node.js

    在Mac、Ubuntu、Windows、Centos下如何安装Node.js,想必有一些朋友还不会吧,本文整理了一些,需要的朋友可以参考下
    2013-11-11
  • JS实现随机化快速排序的实例代码

    JS实现随机化快速排序的实例代码

    这篇文章介绍了JS实现随机化快速排序的实例代码,有需要的朋友可以参考一下
    2013-08-08
  • JavaScript获取ul中li个数的方法

    JavaScript获取ul中li个数的方法

    这篇文章主要介绍了JavaScript获取ul中li个数的方法,涉及javascript针对页面HTML元素的获取及属性操作相关技巧,需要的朋友可以参考下
    2017-02-02
  • javascript动态添加删除tabs标签的方法

    javascript动态添加删除tabs标签的方法

    这篇文章主要介绍了javascript动态添加删除tabs标签的方法,实例分析了javascript针对tabs标签的动态添加与删除方法,涉及javascript页面元素的操作技巧,需要的朋友可以参考下
    2015-07-07
  • 基于JS实现01支付后的10秒倒计时

    基于JS实现01支付后的10秒倒计时

    这是一个通过js实现的支付后的页面,点击支付会跳出一个弹窗,提示你是否要确定支付,确定后进入付后界面,该页面有着10秒倒计时,计时结束后便会返回原界面,也可以选择立刻返回,来返回主页面,这篇文章主要介绍了基于JS实现01支付后的10秒倒计时,需要的朋友可以参考下
    2023-03-03
  • JavaScript 变量作用域及闭包

    JavaScript 变量作用域及闭包

    作用域JavaScript 的变量作用域是按照函数划分的,为了快速的了解它的特性,我们通过实例来进行演示。
    2009-08-08
  • nodejs分离html文件里面的js和css的方法

    nodejs分离html文件里面的js和css的方法

    这篇文章主要介绍了nodejs分离html文件里面的js和css的方法,本文需要分离出一个html 文件里面的script 和style 里面的内容,然后单独生成js文件和css 文件,感兴趣的可以了解一下
    2019-04-04
  • 详解如何在JavaScript中使用for循环

    详解如何在JavaScript中使用for循环

    循环允许我们通过循环数组或对象中的项并做一些事情。在这篇文章中,我们将了解JavaScript提供的for循环,感兴趣的小伙伴可以了解一下
    2022-11-11
  • JSF中confirm弹出框的用法示例介绍

    JSF中confirm弹出框的用法示例介绍

    本文为大家详细介绍下JSF中confirm弹出框的使用方法,感兴趣的朋友可以参考下
    2014-01-01

最新评论