CODEWITHSUNDEEP
javascriptcanvas
JAE IN KIM
JAE IN KIM

Reputation: 63

cannot see anything on Canvas. it is like white background

Recently I tried to practice HTML canvas, but I couldn't draw anything on canvas by JS. It is just all white. I don't know what the problem is. My code is like this:

     <!DOCTYPE html>
     <html lang="en">
     <head>
       <meta charset="UTF-8">
       <title>Document</title>
       <style>
         canvas {border: 1px solid black;}
         body{margin: 0;}
       </style>
     </head>
     <body>
       <canvas id="myCanvas"></canvas>
       <script src="app.js"></script>
     </body>
     </html>

and this is JS code:

     const myCanvas = document.querySelector('#myCanvas');
         myCanvas.width = window.innerWidth;
         myCanvas.height = window.innerHeight;

     const ctx = myCanvas.getContext('2d');
         ctx.fillStyle('#000')
         ctx.fillRect(100, 100, 80, 80);

Upvotes: 1

Views: 96

Answers (1)

Vu Vy
Vu Vy

Reputation: 368

fillStyle is not a function, it is attribute. So you need to assign the color code

 ctx.fillStyle = '#000'

Upvotes: 4

Related Questions