为了账号安全,请及时绑定邮箱和手机立即绑定

火焰特效实现的基本思路

标签:
JavaScript
/*本篇文章面向非编程专业的同学,本人技术有限,高手笑过即可*/

图片描述
......如图所示,一个基本的火焰特效大致如此(这个火焰被我换成了蓝色)。初看这个火焰,是不是看到了很多很多个渐变的小圆在到处乱摆。如果看到了,说明你眼力好。事实也大致如此,火焰它是由一个一个渐变(由深色向浅色)的小圆在指定区域的画布(空间)上,随机地改变自身(小圆)位置,从而形成了肉眼所看到的火焰特效。上述描述可能比较抽象,具体参考我发的图片。
......每个小圆的位置可以通过修改x轴和y轴的坐标来改变(事实上x跟y轴坐标不用程序员改,而是通过随机的方法让它自己随时间而改变,这里的时间又是一个变量,就不往下深入了)。
......好,随机位置解决了,还差点什么?对,之前讲到渐变。实际上就是颜色的渐变。颜色也是可以随机的。可以这么说,世界上的所有颜色是通过基本颜色(红,绿,蓝)按一定比例调和而成的。(自己下的定义,大概理解下就好。)比如,我们小学画画课上就有老师给我们出题目:“同学们,蓝色+红色=?”。对吧,颜色也是可以控制的。程序里面,通过0-255来设置(红,绿,蓝)的量。举个栗子,(255,0,255)就是个紫色(红+蓝,绿为0)。看不懂的同学就再举个栗子,(255,255,255)为白色。ps:别告诉我红+绿+蓝=白色这个你不知道。
......以上所说的是等比例的调和,那不等比例的呢?像(0,10,100)它又是什么颜色呢?有PS的同学就自己去尝试了,这里只讲个思路。那么,回到正题,蓝色火焰渐变怎么实现的呢?这里也不卖关子了,其实就是(0,0-155(这里指绿色的值在0-155之间),255),这样子,固定了红的值为0,固定了蓝的值为255,通过改变绿的量达到颜色只在一种颜色区间内变动(在蓝色范围里,有深蓝,浅蓝,具体多深,多浅,通过值来改变)。(随机绿色的值)。
......好了,火焰特效基本思路也到此了。感兴趣的同学可尝试自己做一下。

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消