原本是用别人用canvas画的热力图的https://github.com/rover95/wxapp-heatmap,但是问题有点多,热力图的颜色,卡顿、叠加、渲染失败等,所以就弃用了,也找了好久,好像大家都没有更好的提议,自己也想到的一个方法就是通过webview来解决这个问题,为了验证我的这个做法,是不是普遍的做法,在微信开发者社区找了一会,确实有些小伙伴是这样做的,之后就下手了,下面简单描述一下
1、使用web-view组件,最好是在后面加上一个生成随机数,因为我发现有时候一直缓存页面,无法更新,太难了
<web-view src="https://自己的服务器的地址/#/heatmap?serviceAreaId={{serviceAreaId}}&random={{Math.ceil(Math.random()*10)}}"></web-view>
2、h5要调腾讯地图的热力图,不要忘了去腾讯地图位置服务添加一个应用哟,生成之后就可以在html中引入这个script了
https://map.qq.com/api/gljs?v=1.exp&key=腾讯地图位置服务后台自己生成的key&libraries=visualization
#腾讯位置服务热力图示例地址
https://lbs.qq.com/webApi/visualizationApi/visualizationGuide/visualizationHeat
#腾讯位置服务自定义图层,自定义图层的贴图的点位使用的是右上角(东北方位)和左下角(西南方位)
https://lbs.qq.com/javascript_gl/doc/imageGroundLayer.html
#腾讯位置服务地图打点,这个功能用到吐了,好多项目都用到了。。
https://lbs.qq.com/webDemoCenter/glAPI/glMarker/sampleMarker
#图一