Matrix 矩阵 JavaScript代码生成器

在这里插入图片描述

今天写了个Matrix 矩阵 JavaScript代码生成器,其实几年前就用Python的pygame实现过一个Matrix,最近在玩JavaScript canvas,索性使用JavaScript原生代码又撸了一遍,并且做了个代码生成器,方便修改Matrix的一些参数。

matrix动画原理

制作matrix动画是一个很有意思的过程,涉及到数组的一些基本操作,还有就是数组的循环和遍历,需要用到JavaScript数组中的一些方法,查看代码对于初学者来说可以学到一些很基础的知识。

matrix就是一个二位数组,[[a,b],[a,b],[a,b]]整个下落的字符就是这个二位数组,其中下落的每一列就是这个大数组中的一个小数组,每个字符就是小数组的一个元素。

我们定义每列下落的字符串样式、起始位置和下落的速度不一样,既可以达到视差效果,每列字符串消失后,就会自动创建一个新的字符串列,这样就会源源不断的下落。

理论上就是这样了,关于JavaScript canvas,只需了解文字绘制和动画的循环,就可以开始至编写代码了,具体的代码就不贴了,有需要的可以在下边的网址上自动生成。

相关资源

Matrix 矩阵 JavaScript代码生成器

Matrix 代码生成器的仓库

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

这里不提提纳里

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

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

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

打赏作者

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

抵扣说明:

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

余额充值