Three 之 three.js （webgl） 中实现简单热力图的方法简单整理

Three 之 three.js （webgl） 中实现简单热力图的方法简单整理

目录

Three 之 three.js （webgl） 中实现简单热力图的方法简单整理

一、简单介绍

二、实现原理

方法 context.createRadialGradient 实现原理

方法 heatmap.js 实现原理

三、注意事项

四、效果预览

五、实现代码

方法 context.createRadialGradient 实现代码，相关过程，见代码注释：

方法 heatmap.js 实现代码，相关过程，见代码注释：

---

一、简单介绍

Three js (官网： Three.js – JavaScript 3D Library) 开发的一些知识整理，方便后期遇到类似的问题，能够及时查阅使用。

本节介绍， three.js （webgl） 中实现简单热力图的方法简单整理，这里主要介绍两种方法，一种是使用 context.createRadialGradient ，一种是使用插件heatmap.js（官网：heatmap.js : Dynamic Heatmaps for the Web），如果有不足之处，欢迎指出，或者你有更好的方法，欢迎留言。