• 在微信開發(fā)文檔給出的信息來看，它使用的是高德地圖的api。
• 我們來到高德地圖的官方坐標拾取器界面，得到示例坐標。

我們在組件中放上map組件，這里提及一下，兩個官方要求的注意點：

請注意原生組件使用限制。

tip:?map?組件使用的經(jīng)緯度是火星坐標系，調(diào)用?wx.getLocation?接口需要指定?type?為?gcj02。

?wxml文件

<view class="container"><map id="map" longitude="120.640509" latitude="31.304899" scale="14" markers="{{markers}}" style="width:100%;height:300px;"></map> </view>

longitude：中心點經(jīng)度，Number類型

latitude：中心點緯度，Number類型

scale：縮放級別，取值范圍5-18

markers：標記點，js文件定義，包含經(jīng)緯度等屬性

style：組件樣式

?

js文件?

Page({data: {markers: [{iconPath: "http://webapi.amap.com/theme/v1.3/markers/b/mark_bs.png",id: 0,longitude: 120.640509,latitude: 31.304899,width: 19,height: 33}]} })

iconPath：標記圖標路徑

id：標記點id，建議每個標記點一個

longitude：經(jīng)度

latitude：緯度

width：寬度

height：高度

還可以設(shè)置其他屬性，見官方參考文檔https://developers.weixin.qq.com/miniprogram/dev/component/map.html#map

效果圖：

總結(jié)

以上是生活随笔為你收集整理的微信小程序-地图组件(map)的使用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。