“热成像”风格的效果是怎么实现的？（内附源码）

未经作者（微信ID：Byte-Flow）允许，禁止转载
文章首发于公众号：字节流动

之前转载过知乎上面的一篇文章：

作者：这是上帝的杰作
链接：https://zhuanlan.zhihu.com/p/344110917

文章详细讲解了 Shader 实现“热成像”效果的思路，但是并没有给出完整的实现代码，后台有读者多次催促，希望我能实现下并给出完整的代码，于是，今天晚上就花了一点时间简单实现了下这个效果。

按照那篇文章的思路，主要步骤是：模糊->发光->亮度分级->替换颜色 ，其中发光这一步不大重要。

可以观察到“热成像”效果的颜色也就是蓝色（冷）和红色（热）组合的几种颜色，然后对颜色做一个排序，并根据亮度等级替换对应的颜色。

至于做模糊，其实就是为了增加层次感而已，可以对比下面的两幅图，左边的是没有做模糊的“热成像效果”。