为什么P5.JS中调用background(0)会导致添加的文本消失?
问题原因分析
p5.js的绘图样式(填充、描边、字体等)都是全局生效的,只要没有重新设置,后续所有绘图操作都会沿用最近一次设置的样式。你遇到的问题本质是文本绘制前全局填充样式fill被你未展示的其他绘图代码修改了,和background(0)本身没有直接关联,逻辑对应如下:
- 原有代码的执行路径中,
setupDefaultTextStyle()设置完文本专用的填充样式后,到testSimpleTextOne()执行前,中间插入的其他图形绘制代码修改了全局的fill属性,最终绘制文本时的填充色和黑色背景完全一致,所以看不见。当你把background参数改成非0值时,哪怕填充色是黑色,也能和非黑背景形成区分,就会出现“只有background(0)时文本消失”的错觉。 - 你将文本绘制逻辑移到
setupDefaultTextStyle()内部后,是设置完填充样式立刻绘制文本,中间没有其他代码修改全局填充属性,填充色为你预期的半透明蓝色,自然可以正常显示。
针对你提到的“修改文本为纯白色依旧无效”的情况,通常是两个原因导致:
- 你修改填充色的位置在
setupDefaultTextStyle()中,改完后还是被后续的其他绘图代码覆盖,没有生效 - 你修改填充色时不小心带了透明度参数,比如误写为
fill(255, 0),第四个参数为0代表完全透明,自然无法显示。
内容的提问来源于stack exchange,提问作者Jay
相关产品推荐
相关产品推荐

