文字烟花特效,用JS代码示爱,女程序媛用这个代码挽回了爱情

createFireworks方法改造如下

function createFireworks(x,y,text=“”){

if(text!=“”){

//绘制文字

}else{

//原有的烟花代码

}

}

传递一个text参数,当此参数不为空时,我们进入文字烟花的绘制逻辑。

var fontSize = 120;

var textHeight = fontSize;

context.font=fontSize+“px Verdana”;

context.fillStyle = “#ffffff”;

context.fillText(text,0,textHeight);

image.png

获取点阵数组

======

这样我们就能把字绘制在画布上了,接着我们使用getImageData来获得并裁剪点阵信息,因为我们只要一部分的点阵。

var imgData = textctx.getImageData(0,0,textWidth,textHeight);

for (var h = 0; h < textHeight; h+=gap) {

for(var w = 0; w < textWidth; w+=gap){

var position = (textWidth * h + w) * 4;

var r = imgData.data[position], g = imgData.data[position + 1], b = imgData.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值