在小程序开发的过程中,我碰到过一个做map的需求,在我开发的时候我碰到了一些问题,这里总结出来,给大家一些解决方法. 简易小程序dome下载 代码片段分享: js部分: var amapFile = require('../../libs/amap-wx.js');//如:..­/..­/libs/amap-wx.js Page({ data: { markers: [], latitude: '', longitude: '', textData: {}, dome:false }, onLo

效果图 实现方法 地图采用微信小程序提供的map组件: 周边的数据坐标点通过高德地图提供的API接口,获取定位位置的周边或者指定位置周边的数据. WXML <view class="map_container"> <view class="map-tab-bar"> <view class="map-tab-li {{item.id == status ? 'active' : ''}}" bindtap="

1.小程序组件map,在微信7.0.4以上(不包括7.0.4)层级问题官方已作更新,可在map上随意添加任何标签使用z-index即可:微信7.0.4版本以下map组件层级默认是最高的,只能使用官方提供的cover-view及cover-image可覆盖原生组件: 2.小程序map自定义个性化地图设置: 1)进入小程序平台,点击开发找到开发者工具,点击腾讯位置服务的查看详情,进入腾讯小程序官网,点击立即接入,选择个性化地图 2)选好地图模板,点击提交 3)复制密钥 4)在小程序map里加上复制好

微信小程序获取用户当前位置有三个方式: 1. wx.getLocation(多与wx.openLocation一起用) 获取当前的精度.纬度.速度.不需要授权.当type设置为gcj02 返回可用于wx.openLocation的坐标2. wx.chooseLocation 需要授权,打开地图选择位置 第一次调用方法时先出现 允许权限之后之后再出现 如果第一次就不允许,则一直调用wx.chooseLocation的fail方法  3. wx.openLocation 需要授权,使用微信内置地图查

微信小程序-获取当前城市位置 1. 获取当前地理位置,可通过wx.getLocation接口,返回经纬度.速度等信息; 注意---它的默认工作机制: 首次进入页面,调用该api,返回用户授权结果,并保持该结果.只要用户未删除该小程序或变更授权情况,那么用户再次进入该页面,授权结果还是不变,且不会再次调用该API: 在不删除小程序的情况下,继续再次发起授权请求,需要使用wx.openSetting. 所以第一步要拿到用户的授权wx.openSetting: 2. 第二步,可通过wx.getLoca

最近需求有一个类似共享单车查看附近单车的功能,看了看小程序map api对多点定位显示描述的不怎么清晰.显示定位数组添加多个时就不显示了.踩了几个坑写了几个方法.最终弄出来了.有问题建议欢迎留言. html: <map id="map" scale="{{scale}}" bindcontroltap="controltap" markers="{{markers}}" bindmarkertap="marke

微信小程序 web 端实时运行工具 https://chemzqm.github.io/wept/

微信小程序实现显示和隐藏控件 .wxml: <view class=" {{showOrHidden?'show':'hidden'}}"></view> .wxss: .hidden { display: none; } .show { display: block; } .js: data: { showOrHidden:true, //判断显示与否的,true表示显示,反之隐藏 }, 简洁的方式,利用wx:if的方式 .wxml: <view wx:

微信小程序中显示html富文本的方法 使用方法:git地址:https://github.com/icindy/wxParse 一.下载wxParse文件 二.在要引入的页面的js文件中,引入文件 js文件中 var WxParse = require('../../../weui/wxParse/wxParse.js'); css文件中 @import "../../../weui/wxParse/wxParse.wxss"; 页面中 <import src="../

最近刚开始接触微信小程序,在弄懂其结构以及相关接口之后,准备着手实现一个小程序,功能包括--获取用户当前位置的经纬度,在地图上查看位置,通过地图获取不同位置的经纬度. 微信小程序的主体部分包括: 新增页面需要在app.json进行配置: "pages":[ "pages/index/index", "pages/location/location", "pages/logs/logs" ] 通过在视图层调用bindtap与逻辑

使用小程序的组件map时 在开发者工具上一切顺利 但是在真机预览时 发现地图的层级是最高的 任何标签都覆盖不了它 调整z-index值并没有什么效果 原因是 微信小程序的map.video.canvas.camera等组件都是原生组件,层级是最高的,并不能像原生开发那样使用z-index来控制层级. 从1.4.0基础库中增加了一个组件cover-view,用于在map.video.canvas.camera等原生组件上显示基础原生视图. 但是用了cover-view这个组件之后 我又发现了一个问

给客户开发一个百度小程序,有个地图定位显示.百度小程序内置的api地图是不准的,通过百度一下,查询到坐标偏移算法公式,自己项目中使用,手机测试坐标已经正常显示! 经纬度,通过百度坐标拾取器拾取到! .swan文件 <map id="myMap" style="width:100%;height:50vh;" longitude="{{longitude}}" latitude="{{latitude}}" scale=&

前言: 小程序需要添加一个定位功能,主要的就是获取用户位置的经纬度,然后根据用户经纬度进行一些判断操作. 在小程序提供的Api中,获取用户定位信息的主要Api是 wx.getLocation(obj) .但是使用这个API,会先获取用户授权.如果用户取消授权,那么再调这个Api,也不会再出现授权页面,也就不能再获取用户位置了,这就需要使用其他的Api辅助打开授权页面了.所以获取用户位置就需要完整的授权.获取位置的流程及异常流处理了. 业务流程图: 关键技术点: 页面加载默认调用 wx.getLo

我一直在纠结为什么小程序在有的页面显示,有的页面不显示 查了一下才知道,小程序tabBar只在tabBar中的list定义了页面的才会显示,其余页面不会显示 如下例:tabBar只在画红框的页面显示

在微信小程序的开发中,我遇到疑惑如下: 在app.json中定义了多个pages,一般微信小程序启动的时候,自动加载pages下的第一个页面, "pages": [              "pages/index/index",           "pages/main/main",      "pages/you/you",      "pages/me/me"  ], "tabBar&q

说起微信小程序的map组件,可以说是良心之作了,一个组件解决了所以接入地图的所有麻烦,但是在实际小程序的试用过程中还是存在点问题的.如下情景:刚开始接入map组件的时候是在微信开发工具的模拟器上预览的,看起来没有一点问题,如下图: 但是在手机上真机模拟的时候就比较尴尬了,地图挡住了我底部的按钮,这个要怎么办呢?先是在百度上百度了好久,别人家写的博客都说,小程序的map组件是层级最高的,这个没办法处理; 然后就觉得凉凉了,不知道要怎么办了,难道要自己重新写个地图吗?感觉又不太现实,于是就问了最近在

如果图片资源在本地,用background-image 是无法找到本地资源的,只能通过image标签用src进行引入: 图片资源在服务器上,用背景图片和image进行引入,在安卓真机上测试是没有问题的.在ios上面,有的图片会显示不出来. 最后解决是,都统一用image进行引入,在生命周期onload时候对src进行赋值,在ios上和安卓都能显示出来. 最近公司新增加一个生成海报,保存到相册的功能. 就是通过canvas将文字和图片,通过定位一点一点画出来,生成一个临时路径的文件.再下载下来保存

因项目需要,以map为背景,上面悬浮有其他组件.微信开发者工具测试时一切正常,但是真机测试时地图组件却把所有的组件覆盖,检查z-index设置,一切正常,地图组件层级也在这些组件的下面,为什么会被覆盖呢? 查小程序官方文档,官方文档表示,map组件层级最高无法用z-index控制.这就很难受了. 那我一定要在地图上放东西怎么办,官方给出解决办法是 1. controls,但是controls的本质就是一张图片,无法满足多样化的需求(controls即将废弃,请使用 cover-view) 2.c

现实需求 在项目中需求,有时候现场设备发生故障,需要远程的人员知道.除了邮件方式,以微信小程序的方式也很好.今天进行尝试,并制作了一个demo版本. 1.微信小程序申请制作前端 1.1lists文件(利用模板和数据绑定循环显示数据) lists.wxml <!--lists.wxml--> <view class="warp"> <!--列表模板--> <template name="lists"> <navig

昨天遇到个奇怪的问题,用户的位置在地图中死活不显示,showUserLocation也设置了,最后发现是因为实现了 mapView protocol中的一个方法: -(MKAnnotationView *)mapView:(MKMapView *)mV viewForAnnotation:(id <MKAnnotation>)annotation: 显示用户位置时会有这个回调,因为自己在里面返回了一个未初始化好的View,导致系统的默认Pin没有显示出来.