前端實戰篇：經過JS抓取城市全部站點與線路

先確認數據來源，既然項目內使用高德地圖，那就去找高德API好了，良久以後以爲高德搜索服務API貌似能夠搞一搞，竟然能夠定位數據城市位置，那敢情好，趕忙先來一發試試。

在瀏覽器地址欄直接敲入：
http://restapi.amap.com/v3/place/text?key=你本身的KEY&types=150700&city=410102&citylimit=true&offset=50&page=1

參數說明：

    key：本身去高德API註冊帳號申請去，反正免費

    types：查詢類型，高德提供的POI分類編碼表（以下圖），150702表示公交車站，可是卻查不到數據，只能用150700車站相關來搞數據了。

POI分類編碼表

    city：查詢城市，高德有提供的城市編碼表（以下圖），410100表示鄭州，0371也表示鄭州，410102表示中原區

城市編碼表

    citylimit：是否只返回指定城市數據（固然要true，我只要鄭州市的數據，false表示優先城市可是依然不作範圍限制）

    offset：每頁條數，高德說最好不超過25（竟然還要翻頁，好吧，畢竟是接口而不是專門讓我抓數據用，我爲啥寫50，是由於就算你寫再多他也給你強制50條，估計是爲了性能考慮）

    page：頁數

    爲何我不用市而是用區數據呢？這就是高德接口的意思啦~（你一次請求那麼多幹嗎？是否是要搞事情？量這麼大數據庫不要抗壓哇？）最多給你900條

鄭州市數據

    不用就不用唄，要是太簡單了還寫個毛線腳本，那就循環多請求幾回好了，把鄭州市的區都來一遍，嗯，不錯，中原區數量還好，696個， 其餘的也都很少

中原區數據

    得，數據有了，仍是json格式的，直接用起來哇，搞起,直接放代碼

var context ="";function snatch(){  

var district = ["410102", "410103", "410104", "410105", "410106", "410108", "410122"];//循環多個區域    for (var k = 0; k < district.length; k++) {        

    var pagecount = 1;        

    var page = 1;         //每一個區域數據須要翻頁（API緣由）     while(1==1) {          $.ajax({url: "http://restapi.amap.com/v3/place/text?key=你本身的KEY&types=150700&city=" + district[k] + "&citylimit=true&output=json&offset=50&page=" + page,             

            async: false,             

            success: function (json) {             //沒有數據就跳出循環去找下個區             if (json.count != 0) {                 pagecount = Math.ceil(json.count / 49);             }               //拼接內容             for (var i = 0; i < json.pois.length; i++) {                 

                var id = json.pois[i].id;                 

                var name = json.pois[i].name;                

                var address = json.pois[i].address;                

                var location = json.pois[i].location;                content += id + "   " + name + "    " + address + "     " + location + "\r\n";             }            }          });          page++;          

          if(pagecount == page){            

            break;          }      }    }    download(); } 

function download() {    

    var file = new File([content], "站點與線路數據.txt", {type: "text/plain;charset=utf-8"});    

saveAs(file); }    

    

邏輯應該算是比較嚴謹了，ajax裏面async: false參數須要加上，表示不使用異步，若是不加的話for循環跑完了你ajax的數據還沒跑完，後面剩餘的次數就不執行了

數據我拿了「id,站點名稱，該站有哪些線路，車站的座標」四組數據，導出txt文檔，而後導入數據庫

    （由於是純JS腳本沒有寫數據庫鏈接啥的，因此使用了FileSaver.js這個小插件來作導出txt，固然jquery.js也是要有的，否則ajax從哪來）

<script src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script><script src="http://www.jq22.com/demo/FileSaver20161213/FileSaver.min.js"></script>

    在網頁上隨便一轉悠找了這倆js直接引入，這樣連js下載啥的都省了，執行後10秒左右，數據已經有了

    接下來就是把數據導入數據庫了，新建了四個字段，而後用navicat直接導入到表中

導入txt

用「|」分隔符區分字段

數據綁定字段

完成數據

    若是須要統計線路或者座標經緯度分離啥的，能夠對js數據格式調整或者用sql對導入後的數據進行調整，隨你意嘍、

    不信就試一試、