Javascript canvas fillStyle 间隔透明/不透明
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7460927/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
canvas fillStyle in interval with transparent/opacity
提问by user951114
This small code clear old canvas data in interval:
这段小代码按间隔清除旧画布数据：
// start interval
ctx.save();
ctx.fillStyle = "rgba(0, 0, 0, 0.2)";
ctx.fillRect(0, 0, ctx.width, ctx.height);
ctx.restore();
//some draw code for new graph
...
//end interval
My work area become black, because i set black as fill color ( rgba(0, 0, 0, .2) ), but I need a transparent background, not black.
我的工作区域变成黑色，因为我将黑色设置为填充颜色（ rgba(0, 0, 0, .2) ），但我需要一个透明的背景，而不是黑色。
I tried use globalAlpha and imagePutData but i failed.
我尝试使用 globalAlpha 和 imagePutData 但我失败了。
How i can do this?
我怎么能做到这一点？
回答by Mubashar Shahzad
I think this will resolve your issue
我认为这将解决您的问题
ctx.fillStyle = "rgba(255, 255, 255, 0.5)";
回答by broofa
Using an rgba(0,0,0,.2)fillStyle and fillRect()works for me on both chrome and firefox - it paints a semi-transparent black fill. Check to make sure you're not doing something else that's causing a fully opaque paint of some sort.
使用rgba(0,0,0,.2)fillStyle 并fillRect()在 chrome 和 firefox 上为我工作 - 它绘制了半透明的黑色填充。检查以确保您没有做其他导致某种完全不透明涂料的事情。
回答by Soyoes
try ctx.canvas.width, instead of ctx.width
尝试 ctx.canvas.width，而不是 ctx.width
回答by u13540582
Has your problem been solved
你的问题解决了吗
I encountered this problem while using Windows computer
我在使用 Windows 计算机时遇到了这个问题
I used opacity: .99solved this problem
我用opacity: .99解决了这个问题
