类似西瓜足迹小程序地图组件怎么开发

最近一款关于朋友圈晒足迹的小程序刷屏火爆，叫做西瓜足迹，这个小程序是如何开发的呢，下面为大家介绍类似西瓜足迹小程序地图组件怎么开发

wxml：

1. class="button" bindtap="getlocation" style="margin-top:30px" markers="{{markers}}">定位
2. longitude="{{longitude}}" latitude="{{latitude}}" markers="{{markers}}" covers="{{covers}}" style="width: 100%; height: 300px;margin-top:30px">

js：

1. //获取应用实例
2. var app = getApp()
3. Page({
4. data: {
5. latitude: 0,//纬度
6. longitude: 0,//经度
7. speed: 0,//速度
8. accuracy: 16,//位置精准度
9. markers: [],
10. covers: [],
11. },
12. onLoad: function () {
13. },
14. getlocation: function () {
15. var markers = [{
16. latitude: 28.211400,
17. longitude: 112.914250,
18. name: '喜地大厦',
19. desc: '我的位置'
20. }]
21. var covers = [{
22. latitude: 28.211400,
23. longitude: 112.914250,
24. iconPath: '/image/ic_position.png',
25. rotate: 0
26. }]
27. this.setData({
28. longitude: 112.914250,
29. latitude: 28.211400,
30. markers: markers,
31. covers: covers,
32. })
33. wx.getLocation({
34. type: 'gcj02',
35. success: function (res) {
36. var latitude = res.latitude
37. var longitude = res.longitude
38. var speed = res.speed
39. var accuracy = res.accuracy
40. console.log("latitude:" + latitude)
41. console.log("longitude:" + longitude)
42. console.log("speed:" + speed)
43. console.log("accuracy:" + accuracy)
44. wx.openLocation({
45. latitude: latitude,
46. longitude: longitude,
47. scale: 28
48. })
49. }
50. })
51. }
52. })

“西瓜足迹”小程序的开发者是南京回路教育科技有限公司。这是一个帮助你在祖国大山河水留下你的足迹的一款游戏软件，在微信小程序中就可以直接打开。但是不少新手玩家并不知道西瓜足迹怎么使用，怎么使用西瓜足迹来记录自己的足迹。

西瓜足迹小程序相关文章

朋友圈晒足迹小程序还有这些，还有美食足迹

西瓜足迹怎么回事？为什么这么火