小程序周边厕所

index.wxml文件如下，markers标点

 
 
<map  id="map" longitude="{{jd}}" latitude="{{wd}}"  
  
markers="{{markers}}" style="width: 100%; height: 1000rpx;"  show-location></map>

index.js文件如下，仍使用上一节的腾讯sdk，在获取当前地理位置后，利用腾讯sdk的search方法查找周边厕所，返回数组数据。选取5个标点进行赋值。

1. var QQMapWX = require('../libs/qqmap-wx-jssdk.js');

2. var qqmapsdk;

3. var latitude1, longitude1;

4. var getdata = [];

5. Page({

6.  data: {

7.  },

9.  onLoad: function (options) {

10.    qqmapsdk = new QQMapWX({

11.      key: '22VBZ-REEK5-WVSI7-QKCOP-QPM6E-W7BPO'

12.    });

13.  },

15.  onReady: function () {

16.    var that = this

17.    wx.getLocation({

18.      type: 'wgs84',

19.      success: function (res) {

20.        console.log(res)

21.        latitude1 = res.latitude

22.        longitude1 = res.longitude

23.        qqmapsdk.search({

24.          location: {

25.            latitude: latitude1,

26.            longitude: longitude1

27.          },

28.          keyword: '厕所',

29.          success: function (res) {

30.            console.log(res.data);

31.            console.log(res.data[0].location.lat);

32.            getdata = res.data

33.            that.setData({

34.              wd: latitude1,

35.              jd: longitude1,

36.              markers: [

37.                {

38.                  iconPath: "../libs/w.jpg",

39.                  id: 0,

40.                  latitude: getdata[0].location.lat,

41.                  longitude: getdata[0].location.lng

43.                },

44.                {

45.                  iconPath: "../libs/w.jpg",

46.                  id: 1,

47.                  latitude: getdata[1].location.lat,

48.                  longitude: getdata[1].location.lng

50.                },

51.                {

52.                  iconPath: "../libs/w.jpg",

53.                  id: 2,

54.                  latitude: getdata[2].location.lat,

55.                  longitude: getdata[2].location.lng

57.                },

58.                {

59.                  iconPath: "../libs/w.jpg",

60.                  id: 3,

61.                  latitude: getdata[3].location.lat,

62.                  longitude: getdata[3].location.lng

63.                },

64.                {

65.                  iconPath: "../libs/w.jpg",

66.                  id: 4,

67.                  latitude: getdata[4].location.lat,

68.                  longitude: getdata[4].location.lng

69.                },

70.              ]

72.            })

74.          }

75.        });

76.      }

77.    })

78.  },

79. })