0

I can't see the stroke from the rectangle. When I create a circle or a triangle, I can see the stroke but when I create a rectangle I can't see it.

This is the code for the rectangle.

context.beginPath();
context.fillStyle = "White";
context.fillRect(470,300,50,50);
context.lineWidth = 3;
context.strokeStyle = "black";
context.stroke();
context.closePath();

This is the result that I get right now.. enter image description here

Thank you in advance for the help!

Rico Papillon
  • 79
  • 6
  • Update your question to include a [mcve] that demonstrates the problem, preferrably in a runnable code snippet. – Herohtar Sep 13 '19 at 17:33

2 Answers2

0

Using context.strokeRect(x,x,x,x); will allow you to see the stroke.

<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
   </canvas>

<script>
var c = document.getElementById("myCanvas");
var context = c.getContext("2d");
context.strokeRect(20, 40, 150, 100);
</script>


</body>
</html>
BLAKE
  • 149
  • 1
  • 15
0

const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
ctx.strokeStyle = 'green';
ctx.strokeRect(20, 10, 160, 100);
<canvas id="canvas"></canvas>
showdev
  • 28,454
  • 37
  • 55
  • 73
Adnan Aslam
  • 96
  • 5