HTML網(wǎng)頁中如何引入地鐵圖?
網(wǎng)友解答: 這里介紹一種簡單的方式,借助高德地圖API,通過JS將地鐵路線圖引入到HTML網(wǎng)頁中,下面我簡單介紹一下實現(xiàn)過程:1.注冊開發(fā)者,這個按著提示一步一步來,輸入必要的注冊信息就
這里介紹一種簡單的方式,借助高德地圖API,通過JS將地鐵路線圖引入到HTML網(wǎng)頁中,下面我簡單介紹一下實現(xiàn)過程:
1.注冊開發(fā)者,這個按著提示一步一步來,輸入必要的注冊信息就行,如下:
2.登陸成功后,進入“個人中心”-“應用管理”-“我的應用”,點擊右上角的“創(chuàng)建應用”,輸入應用名稱和類型,如下:
3.創(chuàng)建成功后,就需要給應用添加key,這個點擊應用右邊的“+”添加就行,設置key名稱,服務平臺選擇web端(JS API),本身就支持地鐵圖JS,如下:
添加成功后,需要記住這個key值,后面的js代碼中要用到:
4.接著,我們就可以引入地鐵路線圖了,參考官方文檔,代碼如下,其實就是引入JS,直接調(diào)用顯示就行:
用瀏覽器打開這個html,效果如下,已經(jīng)成功引入地鐵圖:
至此,我們就完成了將地鐵圖引入到HTML中??偟膩碚f,這個過程很簡單,注冊一下開發(fā)者,引入JS,然后直接在HTML頁面中顯示就行,高德地圖官網(wǎng)對于開發(fā)者提供了非常詳細的資料和實例,每一步都有詳細說明,以及效果圖進行展示,感興趣的話,可以參考一下官方資料,地址https://lbs.amap.com/api/subway-api/subway-summary,網(wǎng)上也有相關教程和資料,希望以上分享的內(nèi)容能對你有所幫助吧。
網(wǎng)友解答:可以使用百度地圖提供的Javascript API,只需要簡單的幾個步驟,就可以在網(wǎng)頁中創(chuàng)建出地鐵地圖。
注冊百度賬號,申請AK注冊一個百度賬號,然后在去申請一個密鑰,申請地址:http://lbsyun.baidu.com/apiconsole/key?application=key;
通過后就可以得到一個AK字符串,如下圖:
引入API文件,并展示地圖將百度地圖的JavaScript API引入網(wǎng)頁,然后設置顯示地圖的容器,并將地圖展示出來。
效果圖:
這樣,我們的百度地圖就調(diào)用成功了。
展示地鐵路線實例化一個地鐵地圖對象,遍歷城市,得到地鐵列表,傳入?yún)?shù),展示地鐵地圖。
效果圖:
上圖就是你想要的地鐵地圖效果了,還是比較簡單的,有不懂的地方,你可以參考百度地圖提供的API文檔。
當然,不一定要用百度地圖API,其他地圖也可以實現(xiàn),如:騰訊地圖、谷歌地圖、高德地圖等。