html5做的中国象棋棋盘
qpan.closePath();
qpan.lineWidth=1;
qpan.rect(6,6,width-
12,height-2);
qpan.stroke();
for(i=0;i<=7;i++){
var begin=56;
var whole=begin
+i*50;
qpan.beginPath();
+100);
qpan.lineWidth=2;
qpan.stroke();
}
function rcenter(x,y){
qpan.beginP;
qpan.lineTo(x+4,y-
3);
qpan.lineTo(x+13,y-
3);
qpan.stroke();
12);
qpan.lineTo(x-4,y-
3);
qpan.lineTo(x-13,y-
3);
qpan.stroke();
qpan.beginPath();
qpan.moveTo(x-4,y
+12);
qpan.lineTo(x-4,y
+3);
qpan.lineTo(x-13,y
+3);
qpan.stroke();
lcenter(site[i]
[0],site[i][1]);
rcenter(site[i]
[0],site[i][1]);
}
lcenter(406,156);
rcenter(6,156);
lcenter(406,306);
rcenter(6,306);
lhome(156,6);
rhome(256,6);
qpan.stroke();
}
for(i=0;i<=8;i++){
var begin=56;
var whole=begin
+i*50;
qpan.beginPath();
qpan.moveTo(7,whole);
qpan.lineTo(width-7,whole);
qpan.closePath();
qpan.stroke();
}
var site=new Array();
site=[[56,106],[356,106],
[106,156],[206,156],[306,156],[56,356],[356,356],
[106,306],[206,306],[306,306]];
for(i=0;i<site.length;i++){
</html>
qpan.beginPath();
qpan.moveTo(x+4,y
+12);
qpan.lineTo(x+4,y
+3);
qpan.lineTo(x+13,y
+3);
qpan.stroke();
}
function lcenter(x,y){
qpan.beginPath();
qpan.moveTo(x-4,y-
}
qpan.beginPath();
function lhome(x,y){
qpan.moveTo(x,y);
qpan.lineTo(x+100,y
+100);
qpan.lineWidth=2;
qpan.stroke();
}
function rhome(x,y){
qpan.moveTo(x,y);
qpan.lineTo(x-100,y
lhome(156,356);
rhome(256,356);
qpan.beginPath();
qpan.font="30px Arial" ;
qpan.strokeText("楚
河",56,241);
qpan.beginPath();
qpan.strokeText("漢
界",256,241);
</script>
var qpan=qp.getContext
("2d");
var
width=qp.width,height=qp.height;
qpan.beginPath();
qpan.strokeStyle='red';
qpan.lineWidth=6;
qpan.rect(0,0,width,height);
qpan.stroke();
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>中国象棋棋盘</title>
</head>
<body>
<canvas id="qp" width="412"
height="461"></canvas>
</body>
<script type="text/javascript">
qpan.moveTo(whole,7);
qpan.lineTo(whole,206);
qpan.closePath();
qpan.stroke();
qpan.beginPath();
qpan.moveTo(whole,256);
qpan.lineTo(whole,height-7);
qpan.closePath();
