Question

我可能在这里做了一些事情，但是我很难在Alpha中使用alpha值进行合作。我试图从画布上的一个点上采样不透明的颜色，使其更透明，并将其放在另一个点 - 但alpha部分似乎不起作用。剥离它有点像这样（从散布在脚本中的函数浓缩）：

p = ground.ctx.getImageData(loc.x, loc.y, 1, 1).data; 
col = {R: p[0], G: p[1], B: p[2], a: p[3]};
col.a = col.a - 0.1;
ground.ctx.fillStyle = 'rgba(' + col.R + ', ' + col.G + ', ' + col.B + ', ' + col.a + ')';
ground.ctx.fillRect(nuLoc.x, nuLoc.y, sqrSize, sqrSize);

这一切都在运行，但是当我测试fillStyle的值时，我只得到一个标准RGB“＃fa674c”或者其他什么 - 没有提到任何alpha - 当我从新绘制的Rect获取getImageData（）时，值是完全不透明。

我无法通过经验或通过阅读每个教程（和规范）来弄清楚的另一件事是alpha是想要0-1.0还是0-255。大多数消息来源都在讨论0-1.0 - 但是getImageData（）会返回0-255 ......而且无论如何都无法使其工作。

Answer 1

使用context.globalAlpha而不是使用rgba fill：

p = ground.ctx.getImageData(loc.x, loc.y, 1, 1).data; 
col = {R: p[0], G: p[1], B: p[2], a: p[3]};

// note: globalAlpha uses a scale of 0-1
// and getImageData uses a scale of 0-255
ground.ctx.globalAlpha = a/255-.1;

ground.ctx.fillStyle = 'rgb(' + col.R + ', ' + col.G + ', ' + col.B + ')';
ground.ctx.fillRect(nuLoc.x, nuLoc.y, sqrSize, sqrSize);

// reset globalAlpha when you're done
ground.ctx.globalAlpha = 1;

新手在画布中不断丢失alpha值

1 个答案: