window.onload = function(){

var c = document.getElementById('mc');

? ? var myc = c.getContext('2d');

? ? var chB = [];

? ? var me = true;

? ? for (var i = 0; i < 15; i++) {

? ? chB[i] = [];

? ? for (var j = 0; j < 15; j++) {

? ? chB[i][j] = 0;

? ? }

? ? }

?/*棋盤*/ ? ?

? ?draw = function(){

? ? for (var i = 0; i < 15; i++) {

? ? myc.moveTo(15+i*30,15);

? ? ? ? myc.lineTo(15+i*30,435);

? ? ? ? myc.stroke();

? ? ? ? for (var j = 0; j < 15; j++) {

? ? ? ? myc.moveTo(15,15+i*30);

? ? ? ? ? ? myc.lineTo(435,15+i*30);

? ? ? ? ? ? myc.stroke();

? ? ? ? }

? ?}

? }

? draw();

? /*棋子*/

? ? ?var one = function (i,j,me) {

? ? ? myc.beginPath();

? ? ? ? myc.arc(15+i*30,15+i*30,13,0,2*Math.PI);

? ? ? ? myc.closePath();

? ? ? ? /*漸變*/

? ? ? ? var gra = myc.createRadialGradient(17+i*30,13+i*30,13,17+i*30,13+i*30,0);

? ? ? ? if(me) {

? ? ? ? gra.addColorStop(0,"#0a0a0a");

? ? ? ? gra.addColorStop(1,"#636766");

? ? ? ? }

? ? ? ? else {

? ? ? ? gra.addColorStop(0,"#d1d1d1");

? ? ? ? gra.addColorStop(1,"#f9f9f9");

? ? ? ? }

? ? ? ? myc.fillStyle = gra;

? ? ? ? myc.fill();

? ? ?}

? ?

? ?c.onclick = function (e) {

? ? ? ?var x = e.offsetX;

? ? ? ?var y = e.offsetY;

? ? ? ?var i =Math.floor(x/30);

? ? ? ?var j =Math.floor(y/30);

? ? ? ? if (chB[i][j]==0) {

? ? ? ? one(i,j,me);

? ? ? ? if (me) {

? ? ? ? chB[i][j]=1;

? ? ? ? }else {

? ? ? ? chB[i][j]=2;

? ? ? ? }

? ? ? ? }

? ? ? ?me = !me ;

? ?}

}