Wednesday, 18 October 2017

NIIT HTML Q2 ACTIVITY BOOK CHAPTER 6 CHESS ~ niit post

Q2) Advin is a web designer and has been given a task to crete a chess board.
   A chess board is a combination of eight rows and eight columns. For this, he needs to create
   a matrix of 8*8 in canvas. In addition, he needs to apply alternate colors on the squares in the chess
   board, i.e. black and white. Help advin to perform this task.




Ans2)

<HTML>
<HEAD>
<canvas id="canvas" width="400" height="400" style="border:1px solid #000000;"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var baseX = 0.5, baseY=0.5, width=50;
for (var i = 0; i < 8; i++){
         for (var j = 0; j < 8; j++) {
              var x = baseX + width * i, y = baseY + width * j;
              if ((i+j) % 2 !=0){
                   ctx.fillRect(x, y, width, width);
                                    }
                      
                       else              {
                       ctx.strokeRect(x, y, width, width);
                                           }
                                           }
                                           }
</script>
<body></body>
</head>
</html>

No comments:

Post a Comment