首頁 web前端 js教程 基於JavaScript實作高德地圖與百度地圖擷取行政區邊界經緯度座標

基於JavaScript實作高德地圖與百度地圖擷取行政區邊界經緯度座標

Mar 30, 2017 am 10:34 AM

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

前言

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

主要问题和解决方法

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

由于安全的原因,JavaScript本地保存文件的方式通常都只有IE支持的ActiveXObject/Open方法,每次都要提示不安全和允许运行,非常麻烦.好在其他浏览器目前都支持标签实现文件下载的方法.经测试最新的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 == &#39;district&#39;||adcodeLevel == &#39;city&#39;) {//第三级时查询边界点
this._district.setExtensions(&#39;all&#39;);
} else {
this._district.setExtensions(&#39;base&#39;);
}
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 = &#39;&#39;;
}
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显示和处理,下次会写一篇笔记.

以上就是基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标_javascript技巧的内容,更多相关内容请关注PHP中文网(www.php.cn)!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

高德地圖怎麼註冊 高德地圖怎麼註冊 Apr 08, 2024 pm 04:39 PM

1.先在手機上安裝並開啟高德地圖app,點選【我的】並選擇【登入/註冊】。 2、依需求選擇手機號碼、微信或支付寶註冊,依照指示填寫個人訊息,包括手機號碼、密碼等。 3.填寫完畢後,點選【註冊】即可完成帳號註冊。 4.之後,使用註冊時選擇的方式進行登入驗證,如透過手機號碼註冊,則需輸入手機號碼和密碼登入。

高德地圖是不是要手機註冊 高德地圖是不是要手機註冊 May 05, 2024 pm 05:12 PM

是的,為了安全保障、個人化服務和帳號管理,高德地圖需要使用手機號碼註冊。註冊步驟包括:開啟高德地圖應用,點擊“我的”和“登入/註冊”,選擇手機號碼註冊,輸入手機號碼取得驗證碼,設定密碼即可完成註冊。

高德地圖導航沒有聲音怎麼回事 高德地圖導航沒有聲音怎麼回事 Apr 02, 2024 am 05:09 AM

高德地圖導航沒有聲音的原因包括揚聲器連接不當、設備音量調低、高德地圖設定錯誤、後台應用程式幹擾、手機靜音或震動模式、系統權限問題。解決方法依序為:檢查揚聲器連接;調整音量;檢查高德地圖設定;關閉後台應用;檢查手機模式;授予權限;重新啟動設備;更新高德地圖;聯絡客服。

摩爾線程與百度地圖簽訂策略合作,共創全新一代數位孿生地圖 摩爾線程與百度地圖簽訂策略合作,共創全新一代數位孿生地圖 Jul 25, 2024 am 12:31 AM

本站7月24日消息,近日,摩爾線程與百度地圖簽署策略合作協議,雙方將發揮各自技術、產品方面的優勢,共同推動數位孿生地圖的技術創新。根據合作協議,雙方將圍繞數位孿生地圖專案建設,利用百度地圖的地圖引擎優勢、數位孿生技術優勢​​、地圖大數據應用優勢,以及摩爾線程全功能GPU的3D圖形渲染和AI計算技術優勢,積極開展深入廣泛的持續性合作,共同推動數位孿生地圖解決方案的應用和規模化落地。根據摩爾線程官方介紹,地圖資料作為國家的關鍵資產,數位孿生地圖尤其凸顯了其在高負載渲染場景中的重要性,這對GPU的渲染效能及

小米CarWith攜手高德地圖,開啟車道級導航新紀元 小米CarWith攜手高德地圖,開啟車道級導航新紀元 Apr 16, 2024 pm 08:34 PM

4月16日消息,近日,小米用戶迎來了一項實用的新功能-小米CarWith正式上線了高德地圖車道導航。此項服務的推出,無疑將為駕駛者帶來更精準、便利的導航體驗。根據數據,高德地圖與CarWith的整合實現了無縫對接,用戶無需進行額外的軟體更新,即可直接體驗車道級導航的精確指引。這項改進很可能是在伺服器端進行的,為使用者省去了繁瑣的更新步驟。汽車道級導航是高德地圖的一項創新功能,它能在屏幕上高度還原真實的道路佈局,清晰展示當前道路的車道數量、地面標識、出入口以及特殊車道等信息,為駕駛者提供更全面、

原神空螢酒館怎麼跟遊戲同部 空螢幕酒館地圖怎麼同步原神手機版 原神空螢酒館怎麼跟遊戲同部 空螢幕酒館地圖怎麼同步原神手機版 Aug 01, 2024 pm 01:54 PM

空螢酒館原神地圖手機版最新版本是一款專為原神愛好者所打造的獨特的地圖輔助軟體,這款軟體詳細的提供了原神之中各個不同區域的各大遊戲地圖,提供了相當強大的編輯標註功能,玩家可以在線上解決原神中的各種不同類型的問題。空螢幕酒館地圖怎麼同步原神手機版? 1.首先需要先下載最新版本的,安裝好後以懸浮窗的形式運作。 2.接著打開原神並進入遊戲後,打開遊戲地圖就可以看到很多的標記。 3、玩家可以在左邊選擇想要顯示的資源標記。 4、然後只需要前往標記的地點,進行相應的操作就可以獲得想要的資源道具。 5.最後還可以點選右上角的

高德地圖出遊記錄怎麼查看 高德地圖出遊記錄怎麼查看 May 05, 2024 pm 05:21 PM

查看高德地圖行程記錄步驟:1. 登入高德地圖;2. 進入「我的」→「我的出行」;3. 查看出行記錄清單;4. 點選查看詳情;5. 匯出記錄(可選) 。

怎麼使用高德地圖開啟家人地圖與家人分享地圖 與家人分享地圖的方法步驟 怎麼使用高德地圖開啟家人地圖與家人分享地圖 與家人分享地圖的方法步驟 May 04, 2024 pm 03:34 PM

高德地圖APP是一款專業好用的免費地圖導航的軟體,大家非常的喜歡,這裡都是擁有著各種各樣的一些功能,完全都能夠為我們的生活帶來極大的便利,什麼一些地點的查詢,路線的規劃,查看到一些街景地圖,或者是經緯度的查詢,這裡都能為你們解決的,操作簡單便捷,超乎你們的想想哦,很多的一些時候,大家都是喜歡在這共享地圖,分享自己的位置信息,都感到更加的有安全感,十分不錯,很多的一些時候,對於自己家中的一些小孩或者是老人來說,他們出門的話,都是會讓人比較擔心,遇到各種的一些狀況,避免大家會走丟的這一情況,就能

See all articles