微信小程序之地图组件

前言：官方提供好了 map组件直接使用即可，具体配置可以参考demo

1、配置权限

"permission": {"scope.userLocation": {"desc": "请求获取地理信息"}
}

2、使用map

wx.getLocation() 可以获取当前位置，需要在小程序中申请，也可以使用demo中的方式获取(如下api获取上下文对象，再进行对应功能的获取)

wx.createMapContext

功能描述

//js文件
Page({data:{latitude: 23.099994,longitude: 113.324520,markers: [{id: 1,latitude: 23.099994,longitude: 113.324520,name: 'T.I.T 创意园'}],covers: [{latitude: 23.099994,longitude: 113.344520,iconPath: '/image/location.png'}, {latitude: 23.099994,longitude: 113.304520,iconPath: '/image/location.png'}]},onLoad(option) {},onShow() {this.getCurrentPosition()},handlePosition(e){let longitude = e.detail.longitudelet latitude = e.detail.latitude},getCurrentPosition(){wx.getLocation().then(res => {console.log(res);this.setData({longitude: res.longitude,latitude: res.latitude,markers: [{id: 0,height: 50,width: 40,longitude: res.longitude,latitude: res.latitude}]})});wx.onLocationChange(it=>{console.log(it,'--监听位置--')})},//查看视频lookVideo(){wx.redirectTo({url:'../video/index'})}
})

微信小程序之地图组件相关推荐

微信小程序百度地图API移动选点
微信小程序百度地图API移动选点本文首发微信小程序百度地图API移动选点因为业务需要使用百度地图API,参考一位大佬编写腾讯API的思路和方法,改造成百度地图API移动选点. 思路: wxml前端 ...
【微信小程序】地图（97/100）
UI布局  <view class="page-section page-section-gap">< ...
微信小程序-MAP API组件合集
合集不断更新,总有一款适合你~ map组件&API 官方文档组件map | 微信开放文档 APIMapContext | 微信开放文档获取当前的地理位置.速度.wx.getLocation ...
微信小程序_基础组件学习02
微信小程序_基础组件学习02 swiper组件 swiper是滑块容器,也就是手机端的轮播图. swiper组件有两部分组成swiper和swiper-item. swiper-item需要放在swi ...
微信小程序基于swiper组件的tab切换
代码地址如下: http://www.demodashi.com/demo/14010.html 一.前期准备工作软件环境:微信开发者工具官方下载地址:https://mp.weixin.qq.c ...
微信小程序授权登录组件的封装
微信小程序授权登录组件的封装新建components文件写wxml文件 wxss部分 js部分 json引用页面使用页面js 授权登录流程如下: 因为多个页面功能需要登录状态所以做了个组 ...
微信小程序使用image组件显示图片的方法
本文实例讲述了微信小程序使用image组件显示图片的方法.分享给大家供大家参考,具体如下: 1.效果展示 2.关键代码 ① index.wxml 代码如下: <image style=" ...
【微信小程序】选择器组件picker
文章目录 [微信小程序]选择器组件picker picker组件的定义 picker组件的类型 picker属性共同的属性时间选择器time 参考 [微信小程序]选择器组件picker picke ...
微信小程序的父子组件传值
微信小程序的父子组件传值如果小程序中有可复用的UI且具有一定的功能性,就可以使用自定义组件将其封装起来. 下面介绍父子组件的数据传递方法,以及一个简单的组件和一个复杂的组件示例. 二.父子组件传递数 ...

微信小程序之地图组件

功能描述

微信小程序之地图组件相关推荐

最新文章

热门文章