微信小程序地图功能展示

上级要求我进行一项关于微信小程序中地图功能使用方式的调研，并完成一个简单的示例程序。

为何会遇到如此多的难题，令人感到困惑不已。

一.效果图

1. 通过markers展示标记点，并利用callout实现自定义的气泡提示框，如图中粉红色边框所示。当用户点击标记点时，系统将输出相关信息；

2. 用户可随意拖动地图至任意区域，点击红色边框内的内容即可返回初始定位位置，即“您所在的位置”；

3. 当拖动操作结束后，系统将获取地图中心点的经纬度坐标，并在控制台中显示对应的信息

二.代码

1.map.wxml组件应用分析

 <map id="map"

    
     longitude="{{longitude}}"
    
     latitude="{{latitude}}"
    
     show-location
    
     scale='15'
    
     markers="{{markers}}"
    
     bindmarkertap="markertap"
    
     controls="