Specifically change the opacity of the stroke, but not the color on the canvas

Question

I have a nice neat script that cycles through colors, and it works fine with the #xxxxxx format, but I want to change the transparency. Is there any way to do this?

I mean ctx.strokeStyle()

Here's the current code:

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

It loops through the for loop with i , incrementing by 1 every loop, and it is part of the switch. The for loop looks like this: for(var i = 0; i < s.length; i++){}

Answer 1

You can change ctx.globalAlpha from 0 to 1 before drawing each element in the opacity you need.

Answer 2

Use ctx.globalAlpha as Martin Tale's answer, or rgba([0-255], [0-255], [0-255], [0-1]) format rgba([0-255], [0-255], [0-255], [0-1]) . Therefore, you need to convert the integer to separate rgb values:

 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+")";