地圖組件是常用的UI組件之一，ivx中的地圖組件是調(diào)用了騰訊地圖的API宿百，具有騰訊地圖的基本功能，除了用于目標(biāo)地點(diǎn)的地圖展示和導(dǎo)航外桶癣，還可用于制作打卡乐横、共享單車等地圖類應(yīng)用求橄。下面是地圖組件可以執(zhí)行的動(dòng)作，包括獲取坐標(biāo)葡公、計(jì)算距離罐农、經(jīng)緯度與地址轉(zhuǎn)換等等。
地圖組件中還可以添加幾種用于地圖標(biāo)記的子組件催什，地圖圓形覆蓋物需要我們?cè)O(shè)置中心點(diǎn)的坐標(biāo)和圓形半徑涵亏；地圖折線覆蓋物是用一個(gè)對(duì)象數(shù)組保存各個(gè)點(diǎn)的坐標(biāo)然后在地圖中相連起來；地圖多邊形覆蓋物與折線類似蒲凶，不過他會(huì)將各個(gè)點(diǎn)連成一個(gè)閉合多邊形溯乒；還有最常用的地圖標(biāo)記，我們可以設(shè)置標(biāo)記的地址豹爹，經(jīng)緯度坐標(biāo)，也可以自己上傳樣式矛纹，選擇是否允許拖動(dòng)等臂聋。
這個(gè)地圖導(dǎo)航模型實(shí)現(xiàn)了簡(jiǎn)單的搜索導(dǎo)航功能，我們結(jié)合它來說明一下地圖組件的具體使用方式或南。
1.首先需要給案例添加了一個(gè)微信公眾號(hào)組件孩等，在前臺(tái)初始化時(shí)，我們會(huì)讓微信公眾號(hào)組件獲取當(dāng)前用戶的位置的經(jīng)緯度坐標(biāo)采够，將其保存到文本變量中并設(shè)置地圖組件的中心點(diǎn)為該坐標(biāo)肄方，這樣打開案例后地圖組件顯示的區(qū)域就是用戶當(dāng)前所在地附近。
2.然后是用戶輸入搜索地址蹬癌，當(dāng)點(diǎn)擊搜索圖標(biāo)時(shí)（實(shí)際上點(diǎn)擊到的是透明按鈕）权她，地圖組件會(huì)對(duì)本地周邊進(jìn)行一個(gè)檢索，將檢索的相關(guān)結(jié)果保存在對(duì)象數(shù)組“搜索結(jié)果”中逝薪。
這里我們可以將“搜索結(jié)果”打印出來看一下隅要，其中包括每個(gè)地點(diǎn)的地址和經(jīng)緯度坐標(biāo)，我們通過for容器循環(huán)創(chuàng)建將標(biāo)記點(diǎn)都顯示在地圖上董济。
3.選中一個(gè)地圖標(biāo)記后步清，我們就將這個(gè)標(biāo)記的經(jīng)緯度坐標(biāo)保存到文本變量中，調(diào)用動(dòng)作組1。在動(dòng)作組中地圖組件會(huì)計(jì)算當(dāng)前位置到選中位置的行駛路線并顯示在地圖上廓啊，這樣一個(gè)簡(jiǎn)易的搜索導(dǎo)航功能就完成了欢搜。
