在微信小程序中如何获取用户当前的地理位置以及在页面上如何给在map组件上的图标绑定事件

效果图

组件

<map id="map" longitude="{ {longitude}}" latitude="{ {latitude}}" scale="15" controls="{ {controls}}" bindcontroltap="controltap" markers="{ {markers}}" bindmarkertap="markertap" polyline="{ {polyline}}" bindregiοnchange="regionchange" show-location style="width: 750rpx; height: 700rpx;position:absolute">

</map>

js代码

// pages/map/driverServer/driverServer.js

Page({

 

/**

* 页面的初始数据

*/

data: {

markers: [{

iconPath: "../../../images/icon/icon-20.png",

id: 0,

latitude: 32.27,

longitude: 108.93,

width: 20,

height: 20

}],//用户当前位置图标

polyline: [{

points: [{

latitude: 34.780254,

longitude: 113.699559

 

}, {

longitude: 113.701855,

latitude: 34.779778

}],

color: "#FF0000DD",

width: 2,

dottedLine: true

}],

controls: [{

id: 1,

iconPath: '../../../images/icon/icon-22.png',

position: {

left: 10,

top: 33,

width: 50,

height: 50

},

clickable: true

}, {

id: 2,

iconPath: '../../../images/icon/icon-30.png',

position: {

top: 288,

left: 10,

width: 50,

height: 50

},

clickable: true

}

],//人物图片定位

drivers:[

{id:"001",title:"1名司机"},

{ id: "002", title: "2名司机" },

{ id: "003", title: "3名司机" },

{ id: "004", title: "4名司机" },

{ id: "005", title: "5名司机" },

{ id: "006", title: "6名司机" },

{ id: "007", title: