小程序开发(10)-之热力图解决方案、手绘图

原本是用别人用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

 

#图一