uni-app使用腾讯地图注意点
地图map组件使用腾讯地图自定义样式:
1:在使用地图map组件腾讯地图时,获取本地定位,经纬度转地址与地址转经纬度解析时,小程序可以直接使用。但是h5版本会报跨域问题,目前前端没有找到更好的解决方法,只能后端丢个接口出来用。 2:小程序跟h5中两种地图写法与引用不一样,需要区分开来,以及标点的渲染,控件的隐藏。
3:在h5中,map自动默认层级为1001,需要在页面中找到相对应的dom结构来进行修改,!修改时注意css权重问题!
4:在h5中,在通过动态地址定位的方试显示标点时,有可能会应为标签渲染走在了定位后赋值之前,会出现本地定位可以但是标点未显示的情况,可以在marker外边套一个setTimeout()解决,因为是在加载完https://map.qq.com/api/gljs之后的先调用的标点方法,所以会出现这个问题。
5:ios手机上明明滑动属性已经禁用,但是还是可以滑动,安卓手机则不会。
h5引用腾讯地图方法:
var script = document.createElement("script"); script.type = "text/javascript"; script.src = "https://map.qq.com/api/gljs?v=1.exp&key=ZO2BZ-AGQ6S-DRUOF-6YNGX-EJVQK-7CFFM&callback=initmap"; document.body.appendChild(script); //在加载完js后执行tmapinit()方法 if(script.readyState){ //IE script.onreadystatechange=function(){ if(script.readyState=='complete'||script.readyState=='loaded'){ script.onreadystatechange=null; that.tmapinit(); } } }else{ //非IE script.onload=function(){ that.tmapinit(); } }
输入框:
h5在一屏内容时安卓手机输入框在软键盘弹起时页面被顶上去无法自动弹下来,在内容外层加上scroll-view可以解决。应该还有其他方法,待探究...
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 记一次.NET内存居高不下排查解决与启示