为什么只要有五颗棋子在一排就弹出赢了,不判断黑白棋

来源:2-3 赢法统计数组和胜负判断

qq_慕沐3338836

2019-02-15 10:22

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        canvas {
            display: block;
            margin: 50px auto;
            box-shadow: -2px -2px 2px #efefef, 5px 5px 5px #999;
        }
    </style>
</head>
<body>
<canvas id="canvas" width="450" height="450"></canvas>
<script>
    var mc = document.getElementById('canvas');
    var ctx = mc.getContext('2d');

    var me = true;
    var chessArr = [];
    var over = false;
    //赢法数组
 var wins = [];
    //赢法的统计数组
 var myWin = [];//人
 var computerWin = [];//计算机

 for (var i = 0; i < 15; i++) {
        chessArr[i] = [];
        for (var j = 0; j < 15; j++) {
            chessArr[i][j] = 0;
        }
    }
    //初始化

    //初始化赢法数组
 for (var i = 0; i < 15; i++) {
        wins[i] = [];
        for (var j = 0; j < 15; j++) {
            wins[i][j] = [];
        }
    }

    var count = 0;//赢法种类索引
    //横线
 for (var i = 0; i < 15; i++) {
        for (var j = 0; j < 11; j++) {
            for (var k = 0; k < 5; k++) {
                wins[i][j + k][count] = true;
            }
            count++;
        }
    }
    //竖线
 for (var i = 0; i < 15; i++) {
        for (var j = 0; j < 11; j++) {
            for (var k = 0; k < 5; k++) {
                wins[j + k][i][count] = true;
            }
            count++;
        }
    }
    //斜线
 for (var i = 0; i < 11; i++) {
        for (var j = 0; j < 11; j++) {
            for (var k = 0; k < 5; k++) {
                wins[i + k][j + k][count] = true;
            }
            count++;
        }
    }
    //反斜线
 for (var i = 0; i < 11; i++) {
        for (var j = 14; j > 3; j--) {
            for (var k = 0; k < 5; k++) {
                wins[i + k][j - k][count] = true;
            }
            count++;
        }
    }
    console.log(wins, count);

    for (var i = 0; i < count; i++) {
        myWin[i] = 0;
        computerWin[i] = 0;
    }
    var logo = new Image();
    logo.src = "img/book.jpg";
    logo.onload = function () {
        ctx.drawImage(logo, 0, 0, 450, 450);
        drawBoard();
    }
    //绘制棋盘
 function drawBoard() {
        ctx.strokeStyle = '#bfbfbf';
        for (var i = 0; i < 15; i++) {
            ctx.moveTo(15 + i * 30, 15);
            ctx.lineTo(15 + i * 30, 435);
            ctx.moveTo(15, i * 30 + 15);
            ctx.lineTo(435, i * 30 + 15);
            ctx.stroke();
        }
    }
    //绘制棋子
 function drawChess(i, j, me) {
        ctx.beginPath();
        ctx.arc(15 + i * 30, 15 + j * 30, 13, 0, 2 * Math.PI);
        ctx.closePath();
        var gradient = ctx.createRadialGradient(15 + i * 30 + 2, 15 + j * 30 - 2, 13, 15 + i * 30 + 2, 15 + j * 30 - 2, 0);
        if (me) {
            gradient.addColorStop(0, "#0a0a0a");
            gradient.addColorStop(1, "#636367");
        } else {
            gradient.addColorStop(0, "#D1D1D1");
            gradient.addColorStop(1, "#f9f9f9");
        }
        ctx.fillStyle = gradient;
        ctx.fill();
    }
    mc.onclick = function (e) {
        if (over) {
            return;
        }
        var x = e.offsetX;
        var y = e.offsetY;
        var i = Math.floor(x / 30);
        var j = Math.floor(y / 30);
        if (chessArr[i][j] == 0) {
            drawChess(i, j, me);
            if (me) {
                chessArr[i][j] = 1;
            } else {
                chessArr[i][j] = 2;
            }
            me = !me;
            for (var k = 0; k < count; k++) {
                if (wins[i][j][k]) {
                    myWin[k]++;
                    computerWin[k] = 6;
                    if (myWin[k] == 5) {
                        window.alert("you win !!!");
                       over = true;
                    }
                }
            }
        }

    }
</script>
</body>
</html>


写回答 关注

2回答

  • 迷茫_彭
    2019-03-27 19:15:28

    if (chessArr[i][j] == 0) {

    drawChess(i, j, me);

    if (me) {

        chessArr[i][j] = 1;

    } else {

        chessArr[i][j] = 2;

    }

    me = !me;

    for (var k = 0; k < count; k++) {

        if (wins[i][j][k]) {

        if(chessArr[i][j] == 1 ){ //这个表示我方赢了      

                 myWin[k]++;

                 computerWin[k] = 6;

                 if (myWin[k] == 5) {

                     window.alert("you win !!!");

                    over = true;

                 }

            }else{

                 myWin[k] = 6;

                 computerWin[k] ++ ;

                 if (computerWin[k] == 5) {

                     window.alert("计算机赢了");

                     over = true;

                 }

            }

        }

    }

    }


  • 迷茫_彭
    2019-03-27 19:09:58

    你判断一下 你的 chessArr[i][j]  值

    if (chessArr[i][j] == 0) {	drawChess(i, j, me);	if (me) {	    chessArr[i][j] = 1;	} else {	    chessArr[i][j] = 2;	}	me = !me;	for (var k = 0; k < count; k++) {	    if (wins[i][j][k]) {	    	if(chessArr[i][j] == 1 ){ //这个表示我方赢了		    	 		        myWin[k]++;		        computerWin[k] = 6;		        if (myWin[k] == 5) {		            window.alert("you win !!!");		           over = true;		        }	        }else{				myWin[k] = 6;		        computerWin[k] ++ ;		        if (computerWin[k] == 5) {		            window.alert("计算机赢了");		           	over = true;		        }	        }	    }	}}


JS实现人机大战之五子棋(AI篇)

"AlphaGO"我要和你下五子棋,教程带你实现五子棋AI

43235 学习 · 109 问题

查看课程

相似问题