用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 实用组件/插件 查看内容

小程序地图map

yuzeng84 2017-6-4 08:18

小程序地图map,含Wxml和JS文件源码。

小程序地图map

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. })

效果图: 
小程序联盟 
小程序联盟

鲜花
鲜花 (1)
鸡蛋
鸡蛋 (1)

刚表态过的朋友 (2 人)

分享至 : QQ空间
收藏
原作者: 返回主页 Farbitrary

相关阅读