4 <title> Chess Board
</title>
9 <canvas id=
"myCanvas" width=
"560" height=
"560" style=
"border:2px solid #d3d3d3;">
10 Your browser does not support the HTML5 canvas tag.
11 TODO: describe chessboard ?
16 // TODO: draw hexagonal board, allow click and drag pieces
17 // ==
> work with coordinates and current board size as a parameter
19 var c=document.getElementById("myCanvas");
20 var ctx=c.getContext("
2d");
32 for(var a=
0;a
<8;a++) {
33 for(var b=
0; b
<8;b+=
2) {
35 if(a%
2==
0) startX = (b+
1) *
70;
36 ctx.fillRect(startX + left,(a*
70) ,
70,
70);
40 let x=
100, y=
100, size=
40;
42 ctx.moveTo(x + size * Math.cos(
0), y + size * Math.sin(
0));
43 for (let side=
0; side <
7; side++) {
44 ctx.lineTo(x + size * Math.cos(side *
2 * Math.PI /
6), y + size * Math.sin(side *
2 * Math.PI /
6));
46 ctx.fillStyle =
"#333333";
49 var img = new Image();
50 img.onload = function() {
51 ctx.drawImage(img,
0,
0,
60,
60);
53 img.src =
"public/images/pieces/wb.svg";