怎么利用uniapp開發(fā)一個(gè)簡單的地圖導(dǎo)航?本篇文章就來為大家提供一個(gè)制作簡單地圖的思路,希望對(duì)大家有所幫助!
先來看一眼效果圖
簡易map
在圖一的地圖中可以看到 a點(diǎn) 連接 到 b點(diǎn), 基本信息 以及 基本的控件(放大、縮小、回到某個(gè)指定的點(diǎn)),接下來我們分開逐步講解。
所需配置
需要先在manifest.json
中的 app模塊
中配置地圖,并添加相關(guān)地圖的key
,如果沒有可在相關(guān)開發(fā)者平臺(tái)進(jìn)行申請(qǐng)
配置好這一部分就可以開始使用map組件了
地圖標(biāo)記點(diǎn)
在uniapp map中想創(chuàng)建標(biāo)記點(diǎn)就需要使用到一個(gè)屬性 markers
。
我們先來看一下markers
的常用屬性
名稱 | 說明 | 類型 | 必填 |
---|---|---|---|
id | 標(biāo)記點(diǎn)id | number | true |
latitude | 緯度 | number | true |
longitude | 經(jīng)度 | number | true |
iconPath | 顯示的圖標(biāo) | string | false |
callout | 自定義標(biāo)記點(diǎn)上方的氣泡框 | Object | false |
label | 為標(biāo)記點(diǎn)傍邊增加標(biāo)簽 | Object | false |
查看