简体   繁体   English

特别是在画布上改变笔触不透明度而不是颜色

[英]Specifically change stroke opacity but not color on canvas

I have a nice tidy script that cycles through colors and it works nicely with the #xxxxxx format, but I want to change the transparency. 我有一个漂亮整洁的脚本循环颜色,它与#xxxxxx格式很好地工作,但我想改变透明度。 Is there a way to do that? 有没有办法做到这一点?

I'm referring to ctx.strokeStyle() 我指的是ctx.strokeStyle()

Here's the current code: 这是当前的代码:

canvas.strokeStyle = '#' + (((16777215 / s.length) * i).toString(16));

It cycles through a for loop with i incremented by 1 each cycle and it's a part of a switch. 通过一个for循环它周期与i递增1每个周期,它是一个开关的一部分。 The for loop looks like this: for(var i = 0; i < s.length; i++){} for循环如下所示: for(var i = 0; i < s.length; i++){}

在绘制所需的不透明度中的每个元素之前,您可以在0到1的范围内更改ctx.globalAlpha

Use ctx.globalAlpha like Martin Tale answered or rgba([0-255], [0-255], [0-255], [0-1]) format. 使用像Martin Tale回答的ctx.globalAlphargba([0-255], [0-255], [0-255], [0-1])格式。 So you need to convert the integer to individual rgb values: 所以你需要将整数转换为单独的rgb值:

var color = ((16777215 / s.length) * i);
var r = (color >> 16) & 255;
var g = (color >> 8) & 255;
var b = color & 255;

var alpha = 0.5;

canvas.strokeStyle = "rgba("+r+","+g+","+b+","+alpha+")";

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM