养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

微信小程序map地图组件基本使用详解

时间:2024-10-11 00:28:06

本篇经验将继续分享map地图组件的使用详解。该经验将基于第一个手工构建的微信小程序演示,具体构建步骤,可参考如下经验引用。

微信小程序map地图组件基本使用详解

工具/原料

微信开发者工具

方法/步骤

1、先百度搜索查看map地图组件的官方文档,在基本捂执涡扔使用中,比较常用的属性有latitude(显示地图的中心纬度),longitude(中心经度),scale(缩放比例)等。

微信小程序map地图组件基本使用详解

2、在wxml文件中通过<map>标签创建地图区域,设置如下属性:龀音孵茧1.latitu颊俄岿髭de:地图显示区域的中心纬度;2.longitude:地图显示区域的中心经度;3.scale:地图的缩放比例,可选值:3到20。通过内联样式设置地图的宽高,并绑定视野发生变化时会触发的调用函数。注意,上述属性通过数据绑定赋值,相关内容可参考如下经验引用。

微信小程序map地图组件基本使用详解

3、js文件中声明上述数据绑定使用的变量信息,以及使用的事件监听函数。

微信小程序map地图组件基本使用详解

4、wxss中声明wxml中使用的类对应的样式定义。

微信小程序map地图组件基本使用详解

5、保存编译后,在模拟器中可以查看地图的显示效果,移动地图显示区域,在调试器中可以看到其会触发绑定的视野变化监听函数的调用。

微信小程序map地图组件基本使用详解

© 一点知识