50字范文,内容丰富有趣,生活中的好帮手!
50字范文 > canvas文字换行 多图片加载 显示错乱 或被覆盖的问题

canvas文字换行 多图片加载 显示错乱 或被覆盖的问题

时间:2021-07-07 08:55:56

相关推荐

canvas文字换行 多图片加载 显示错乱 或被覆盖的问题

var wordList=words.split('')//把文字变成集合let wordX=0;//文字的起始位置X let wordY=0;//文字的起始位置Y//基础标点符号集合var fhArr=[",", ",", "。", "。", "!", ";", ":", "“", "”", "?", "【", "】", "、"]let wordI=0;//自增判断每一行的位置for(var i=0;i<wordList.length;i++){ctx.fillText(wordList[i], wordX, wordY);//显示文字wordX+=40//文字间隔、下一个文字的X位置wordI++;//自增,当前行的文字显示到第几个///当X的位置超出显示的位置或者(文字的位置+1到新的一行并且是标点符号时),当前文字换行展示,"12"一行显示12个文字if(wordX>750||((wordI+1)%12==0&&fhArr.includes(wordList[i+1]))){wordX=0;wordY+=42;//行间隔wordI=0;//初始化,重新计算}}

ps:canvas中图片加载的问题,建议嵌套加载,当一个图片加载完成时,在加载下一个(尤其是图片上有文字,或者多个图片叠加显示的时候),要不然会出现加载的时间差导致图层错乱

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。