站長資訊網(wǎng)怎么利用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 |
查看
