微信小程序定位及导航

矫情吗；* 2022-11-14 14:56 188阅读 0赞

app.json

"permission": { 
      "scope.userLocation": { 
        "desc": "你的位置信息将用于小程序位置接口的效果展示"
      }
    },

wxml

Page({ 
      /** * 页面的初始数据 */
      data: { 
        scale:14,//缩放级别，取值范围为3-20
        //当前定位位置
        latitude: '',
        longitude: '',
        //标记点
        markers:[{ 
          id:"map",
          latitude:'30.721657',
          longitude:'103.996152',
          iconPath:'../../image/location.png',
          alpha:0.9,
          width:'50rpx',
          height:'50rpx'
        }]
      },
      // 定位导航地址
      location(){ 
        wx.chooseLocation({ 
          success:function(res){ 
            console.log(res,"定位")
            wx.openLocation({ 
              latitude:res.latitude, //要去的纬度-地址
              longitude:res.longitude, //要去的经度-地址
            })
          }
        })
      },
      //获取当前位置
      redirect(){ 
        wx.getLocation({ 
          type: 'gcj02',
          success: (res) => { 
            console.log(res,"当前位置")
            this.setData({ 
              latitude: res.latitude,
              longitude: res.longitude
            })
          }
        })
      },
      // 点击地图标记位置
      markertap(e){ 
        console.log(e,"点击")
       if(e.detail.name){ 
        // 开始标记
         this.data.markers[0].latitude=e.detail.latitude;
         this.data.markers[0].longitude=e.detail.longitude;
         this.setData({ 
          markers:this.data.markers
         })
        // 导航选定地址
         wx.openLocation({ 
          latitude:e.detail.latitude, //要去的纬度-地址
          longitude:e.detail.longitude, //要去的经度-地址
        })
      }
      },
      onLoad() { 
        //获取当前位置
       this.redirect()
      }
    })