微信小程序之 map 地图使用
1、在app.json中与pages平级的位置处,加上:
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口展示"
}
},
注意:必须有类似于上面的汉字文字说明。
<button open-type="getUserInfo">允许使用微信昵称等</button>
<button bindtap="getlocation">允许使用位置</button>
<button bindtap="userconfig">设置</button>
<map class='map' id='myMap' longitude="{{longitude}}" latitude="{{latitude}}" scale="{{scale}}"
show-location="true" markers="{{markers}}" bindmarkertap="bindMakertap" bindcontroltap='controlTap'
bindregionchange='regionChange' controls='{{controls}}'
bindtap='bindMapTap'></map>
3、在.js中
getlocation: function() {
console.log("a")
wx.getSetting({
success(res) {
if (!res.authSetting['scope.userLocation']) {
console.log("not?")
wx.authorize({
scope: 'scope.userLocation',
success() {
// 用户已经同意小程序使用录音功能,后续调用 wx.startRecord 接口不会弹窗询问
//wx.startRecord()
}
})
}else{
console.log("允许",res)
wx.getLocation({
success: function(res) {
console.log(res)
},
})
}
}
})
console.log("b")
},
userconfig: function() {
console.log("conf")
// 获取
wx.openSetting({
success(res) {
console.log(res.authSetting)
// res.authSetting = {
// "scope.userInfo": true,
// "scope.userLocation": true
// }
}
})
}
经测试可以取到位置经纬度。
参考:https://www.jianshu.com/p/5b2f95a16fce
微信小程序之 map 地图使用的更多相关文章
- 微信小程序-基于高德地图API实现天气组件(动态效果)
微信小程序-基于高德地图API实现天气组件(动态效果) 在社区翻腾了许久,没有找到合适的天气插件.迫不得已,只好借鉴互联网上的web项目,手动迁移到小程序中使用.现在分享到互联网社区中,帮助后续有 ...
- 微信小程序_(map)简单的小地图
map地图效果 官方文档:传送门 Page({ data: { markers: [{ iconPath: "/resources/others.png", id: 0, lati ...
- 微信小程序腾讯地图SDK使用方法
一.本篇文章主要知识点有以下几种: 1.授权当前位置 2.map组件的使用 3.腾讯地图逆地址解析 4.坐标系的转化 二.效果如下: 三.WXML代码 <map id="map&quo ...
- [微信小程序]在应用地图时,如何设置满屏(高度)
微信小程序在做地图功能时 用常规的办法height:100%:来设置高度来占满屏幕是不行的 它不会生效 应该改用单位vh 例如 height:100vh 这样就可以是地图占满整个屏幕高度
- 小程序开发-Map地图组件
Map组件 是原生组件,使用时请注意相关限制.个性化地图能力可在小程序后台"设置-开发者工具-腾讯位置服务"申请开通. 设置subkey后,小程序内的地图组件均会使用该底图效果,底 ...
- 微信小程序添加外部地图服务数据
先上效果: 缘起 使用微信小程序做地图相关功能的时候,有个需求是需要接入自己发布的地图服务.查看微信小程序地图组件文档,发现它对地图相关的支持很少,只有一些基础功能,比如添加点.线.面.气泡和一些常规 ...
- 微信小程序手绘地图实现之《Canvas》
环境:微信SDK2.9+ + uniapp (可切换直接使用.map.js不限制环境) 正题: 先创建一个地图组件 <template> <view class="cu ...
- 小程序之map地图上不能在覆盖层
问题:页面上有一个地图功能,地图上面有两个按钮,是需要覆盖在地图上的,在小程序编辑器中显示是没问题的,但是扫码测试后发现在手机上不显示这两个按钮 解决方法:使用cover-viwe标签包裹一下就可以了
- Taro开发微信小程序之初始化地图到当前位置
在componentDidMount中,初始化mapCtx. let _this = this this.mapCtx = Taro.createMapContext('container') //c ...
随机推荐
- image analogies笔记
Image Analogies 个人学习笔记, 根基尚浅, 免不得颇多纰漏, 望批评指教. 这是一篇2001年的文章, 其核心主要讲了如何将一对图片之间的"转换模式"应用到其他图片 ...
- chrome 调试 ios h5
1,安装itunes, 否则无法识别iphone设备 2,开启调试模式 ,打开 iPhone 依次进入 设置 > Safari > 高级 > Web 检查 > 启用 3,下载 ...
- NeurIPS 2018 中的贝叶斯研究
NeurIPS 2018 中的贝叶斯研究 WBLUE 2018年12月21日 雷锋网 AI 科技评论按:神经信息处理系统大会(NeurIPS)是人工智能领域最知名的学术会议之一,NeurIPS 2 ...
- Tomcat与WAS应用中间件差异化分析研究
--转载 http://blog.chinaunix.net/uid-25723371-id-5759072.html 目前我们在使用的基于JAVA的提供逻辑展现应用中间件有两种,一种是以商用软件WA ...
- 通过gpio控制一个进程开启或关闭
目标: 板子上有个进程需要通过读取gpio的值, 当gpio值为1 时, 开启指定的进程,当gpio为0时, 杀掉这个指定的进程. #include <stdio.h> int main( ...
- opencv-03--图像的算术运算
图像的算术运算 Mat类把很多算数操作符都进行了重载,让它们来符合矩阵的一些运算,如果+.-.点乘等. 下面我们来看看用位操作和基本算术运算来完成colorReduce程序,它更简单,更高效. 将25 ...
- vue的自定义指令
点击元素之外触发函数 <template> <div v-clickoutside="clickItemOut"></div> </tem ...
- 伪元素before和after本质
之所以被称为伪元素,是因为他们不是真正的页面元素,html没有对应的元素,但所有的用法和表现行为和真正的页面元素是一样的,可以对其使用诸如页面元素一样的css样式,表面上看上去貌似页面的谋些元素,实际 ...
- ionic 局部刷新
$scope.$on('$ionicView.beforeEnter', console.log("刷新"); })
- 在浏览器输入 URL 回车之后发生了什么
注意:本文的步骤是建立在,请求的是一个简单的 HTTP 请求,没有 HTTPS.HTTP2.最简单的 DNS.没有代理.并且服务器没有任何问题的基础上. 大致流程 URL 解析 DNS 查询 TCP ...