Maison > Article > Applet WeChat > Carte du programme WeChat Mini Explication détaillée et exemples simples
Carte de la carte du programme WeChat Mini
Carte du programme WeChat Mini
Carte
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
longitude | Number | 中心经度 | |
latitude | Number | 中心纬度 | |
scale | Number | 1 | 缩放级别 |
markers | Array | 标记点 | |
covers | Array | 覆盖物 |
Point marqué
Les points marqueurs sont utilisés pour afficher les emplacements marqués sur la carte, les icônes et les styles ne peuvent pas être personnalisés
属性 | 说明 | 类型 | 必填 | 备注 |
---|---|---|---|---|
latitude | 纬度 | Number | 是 | 浮点数,范围 -90 ~ 90 |
longitude | 经度 | Number | 是 | 浮点数,范围 -180 ~ 180 |
name | 标注点名 | String | 是 | |
desc | 标注点详细描述 | String | 否 |
Superpositions
Les superpositions sont utilisées pour placer des marqueurs sur la carte Des icônes personnalisées sont affichées sur la carte, et les icônes et les styles peuvent être personnalisés
属性 | 说明 | 类型 | 必填 | 备注 |
---|---|---|---|---|
latitude | 纬度 | Number | 是 | 浮点数,范围 -90 ~ 90 |
longitude | 经度 | Number | 是 | 浮点数,范围 -180 ~ 180 |
iconPath | 显示的图标 | String | 是 | 项目目录下的图片路径,支持相对路径写法 |
rotate | 旋转角度 | Number | 否 | 顺时针旋转的角度,范围 0 ~ 360,默认为 0 |
La longitude et la latitude du composant cartographique sont requises. Si la longitude et la latitude ne sont pas renseignées, le. la valeur par défaut est la longitude et la latitude de Pékin.
Les marqueurs ne peuvent être définis que lors de l'initialisation et ne prennent pas en charge les mises à jour dynamiques.
Exemple :
<!-- map.wxml --> <map longitude="23.099994" latitude="113.324520" markers="{{markers}}" covers="{{covers}}" style="width: 375px; height: 200px;"> </map>
// map.js Page({ data: { markers: [{ latitude: 23.099994, longitude: 113.324520, name: 'T.I.T 创意园', desc: '我现在的位置' }], covers: [{ latitude: 23.099794, longitude: 113.324520, icaonPath: '../images/car.png', rotate: 10 }, { latitude: 23.099298, longitude: 113.324129, iconPath: '../images/car.png', rotate: 90 }] } })
Bogue et astuce
astuce : N'utilisez pas de composant de carte dans la vue défilante
Merci d'avoir lu, j'espère que cela pourra aider tout le monde, merci pour votre soutien à ce site !
Pour plus de détails sur la carte du mini-programme WeChat et des exemples simples, veuillez faire attention au site Web PHP chinois !