前言:
前端開發過程中有很多需求涉及到可視化數據展示,其中地圖數據展示占據了很大一部分。數據可視化地圖展示不論使用現有的可視化框架EChart、Highcharts,還是現在比較火爆的WEB GL技術,或者是通過canvas自己繪制,核心都是通過經緯度將其輪廓繪制出來再進行渲染。我剛開始做類似需求的時候基本都是通過度娘去搜索,或者在對應的論壇中發帖求助,但是無論是那種方法,基本找到合適的經緯度信息都需要花費大量的時間,增加開發成本。針對上述的困惑,今天我就給大家帶來一個快速獲取中國省市區縣經緯度的工具。
1、軌跡經緯度拾取系統功能介紹
進入軌跡經緯度拾取系統,會看到如下界面,1為搜索區域,輸入對應需要獲取經緯度信息的省市區名稱,或者特定點的名稱便可以搜索;2為地圖皮膚和勾選工具配置開關;3為鼠標繪制工具,可以繪制點,圓,折線,多邊形,四邊形軌跡;4為軌跡展示開關;5為地圖展示區域。
2、軌跡經緯度拾取系統配置功能介紹
軌跡經緯度拾取系統配置項包括地圖皮膚配置,如下圖展示。軌跡區域邊框和填充區域顏色及透明度配置。地圖皮膚提供了9中皮膚,分別是默認地圖風格,清新藍風格,黑夜風格,精簡風格,自然綠風格,午夜藍風格,浪漫粉風格,清新藍綠風格,高端灰風格。
3、獲取省市區輪廓經緯度信息
搜索框輸入需要獲取輪廓經緯度信息的省市區的名稱,比如浙江省,按回車或者鼠標點擊搜索按鈕,在對應的搜索結果中選中標有行政區域的列表便可以在地圖上勾勒出浙江省的輪廓。點擊軌跡列表開關,在展開的列表中點擊對應軌跡的詳情按鈕,在展開的詳情彈窗中便可以看到浙江省輪廓對應的軌跡,左側是格式化后的軌跡信息,右側為未格式化的字符串信息,通過復制便可以直接粘貼到自己項目中使用。
4、獲取交通線路(地鐵、公交)軌跡信息
搜索框輸入需要獲取交通線路的名稱,比如杭州地鐵2號線,按回車或者鼠標點擊搜索按鈕,在對應的搜索結果中選中標有交通線路的列表便可以在地圖上勾勒出杭州地鐵2號線的軌跡。點擊軌跡列表開關,在展開的列表中點擊對應軌跡的詳情按鈕,在展開的詳情彈窗中便可以看到浙江省輪廓對應的軌跡,左側是格式化后的軌跡信息,右側為未格式化的字符串信息,通過復制便可以直接粘貼到自己項目中使用。
5、獲取自定義軌跡經緯度
鼠標點擊選中需要自定義軌跡的類型,比如點坐標,園形軌跡,折線軌跡,多邊形軌跡,四邊形軌跡。本例中選擇通過折線軌跡手繪出杭州地鐵二號線。首選鼠標選中折線繪制工具,然后在地圖上根據杭州地鐵2號線的走向勾勒出軌跡,繪制萬最后一個經緯度點后雙擊,在彈出的彈窗中輸入軌跡的名稱,這個名稱可以隨意定義,然后點擊保存,余下步驟同上。
預覽地址:軌跡經緯度拾取系統