手把手教你生成足跡地圖
專案地址： ofollow,noindex" target="_blank">travelMap
一直想有個東西記錄一下去過的地方，百度地圖上有個足跡功能，能記錄你去過的地方，不過你沒辦法在其他地方去呼叫這個功能，相對來說不是特別方便。
網上常見的足跡地圖方案是用 jvectormap 去寫的，但是jvectormap縮放後不能得到更詳細地地圖資訊。於是就藉助 leaflet-echarts3 做了一個足跡地圖。leaflet-echarts3雖然只提供uglify以後的合併版本，但是寫一個簡單的足跡地圖還是綽綽有餘。
這個專案使用很簡單，如果你不會程式設計也沒關係，我把使用者資料獨立出來，你只要查詢一下經緯度，照著格式填寫就行。
首先，先點選下載這個專案 travelMap 。下載解壓後，資料夾中有下面幾個檔案（ .gitignore 可能你會看不到）：
在這些檔案中，你只需要編輯 mapData.js 就行，其他都不需要你修改任何程式碼。
為了方便編輯對應的檔案，推薦去下載微軟的 visualstudio code 開啟對應的檔案。
安裝完visualstudio code，在File–>Open Folder中開啟剛剛解壓的資料夾：
這時候你可以看到相應的資料，只要按照一樣的格式新增相應的資料就行。拿下面一行資料舉例，說明一下各個引數代表的意義：
{name: '巴塞羅那', value: 30, description: '2018年5月', geoCoord:[41.3825,2.1769]},
上面一行中：
-
value表示地圖上黃色點的大小，數值越大，顯示的大小越大； -
geoCoord表示了經緯度，相關資料可以通過 gpsspg 查到，查到的資料之間放到[]中就行； -
name和description表示了滑鼠懸浮在黃色點上顯示的內容，如下圖所示：
這裡對非程式設計人員提醒一下，所有的符號必須是英文狀態下打出來的，如果是中文狀態會報錯，修改前可以在編輯器裡面嘗試輸入一下中文狀態和英文狀態下的符號，能很明顯看出不同。最後每一行結尾的逗號不要漏掉了，這個要注意一下。
修改完資料，雙擊資料夾中的 index.html ，就會呼叫你本機的瀏覽器（或者把這個檔案拖到瀏覽器中開啟），這時候就可以看到你自己的足跡地圖了。每次修改後，重新整理一下瀏覽器，就可以看到修改後的效果了。
如果你想玩點更高階的，推薦去 Echarts例項 看看相關圖表，隨便選個例項點進去，然後根據 配置項手冊 的說明生成一個自己的的圖表吧。