问题是描边不透明度低于填充不透明度,并且我无法使描边颜色与填充颜色具有相同的不透明度。
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.strokeStyle = "rgba(255,0,0,1)";
ctx.fillStyle = "rgba(255,0,0,1)";
ctx.strokeRect(20, 20, 25, 25);
ctx.fillRect(20, 50, 25, 25);Run Code Online (Sandbox Code Playgroud)
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>Run Code Online (Sandbox Code Playgroud)
如果我们将 fillStyle 不透明度设置为 0.5,那么它们将是相同的,但我们不能提高描边的不透明度。
那么如何设置描边颜色与填充颜色相同呢?