“热成像”风格的效果是怎么实现的?(内附源码)

本文通过Shader详细解析并实现“热成像”效果,包括模糊、发光、亮度分级和颜色替换等步骤,提供了完整的代码示例。通过对比展示了模糊处理对层次感的提升,并给出了颜色查找数组和灰度值分层的实现方法。

未经作者(微信ID:Byte-Flow)允许,禁止转载
文章首发于公众号:字节流动

图片

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

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

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

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

图片

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

至于做模糊,其实就是为了增加层次感而已,可以对比下面的两幅图,左边的是没有做模糊的“

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

字节流动

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值