• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

微信小程序嵌入MapBox地图方法研究

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

最近微信小程序比较火,MapBox在地图前端框架里也比较热门,微信小程序内置的map是腾讯地图,这对于一个GIS开发者来说是远远不能满足的。自己也想了一下Mapbox与微信小程序集成的几种方法

1.直接放到微信小程序中

肯定不行,因为小程序里没有div标签

2.借助第三方框架

腾讯的WePy的框架肯定不行,同样不支持div。美团的mpvue框架,亲自测试了一下,同样不行,虽说mapvue可以用原生html和vue开发,但是在编译成的时候,还是将div转换成了view,转换后小程序直接运行错误,移除MapBox就正常

3.WebView的开发方式

类似Android WebView的开发,但是小程序的WebView接口受限,只能访问基于https或ws协议的网页地址,而且要配置到域名白名单,但作为测试的时候还是可以用http地址的网页的。测试了一下,在手机上市可以展示的

注意这种方式有以下限制

  1. Android5.0以下版本不支持WebGL,MapBox就不会显示(测试时有一个5.1.1的手机也没有显示)
  2. 配置低的手机会有卡顿现象,毕竟WebView的绘制能力有限
  3. 配置高的手机会比较流畅,但当有大量矢量瓦片时,也会有轻微卡顿

在支付宝小程序测试模拟器可以显示,真机网页一直被阻拦,这里就没法告诉大家结果了


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
小程序App与Page的生命周期发布时间:2022-07-18
下一篇:
解决小程序渲染图片出现403的问题发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap