weixin_慕丝4233278
qq_面朝黄土_0
该种树啦
最好放点代码或者console的报错出来 这么干说也没法看呀,
话说你可以换个浏览器试试,我之前用chrome 棋子渲染一直不对,换IE就好了
该种树啦
这代码两不多照着写。没问题的。
/**
*
*/
var me = true;
var chessBorad = [];
var over = false;
//赢法数组
var wins = [];
//赢法统计数组
var myWin = [];
var computerWin = [];
for(var i = 0;i < 15;i++){
chessBorad[i] =[];
for(var j = 0;j < 15;j++){
chessBorad[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++;
}
}
for(var i = 0;i<count ;i++){
myWin[i] = 0;
computerWin[i] = 0;
}
var chess = document.getElementById('chess');
var context = chess.getContext('2d');
context.strokeStyle = "#BFBFBF";
var logo = new Image();
logo.src="images/8.jpg";
logo.onload = function(){
context.drawImage(logo,0,0,450,450);
drawChessBoard();
}
var drawChessBoard=function(){
for(var i=0;i<15;i++){
context.moveTo(15+i*30,15);
context.lineTo(15+i*30,435);
context.stroke();
context.moveTo(15,15+i*30);
context.lineTo(435,15+i*30);
context.stroke();
}
}
var onStep = function(i,j,me){
context.beginPath();
context.arc(15 + i * 30,15 + j * 30, 13, 0, 2 * Math.PI);
context.closePath();
var gradient = context.createRadialGradient(15+i*30+2,15+i*30-2,13,15+i*30+2,15+i*30-2,0);
if(me){
gradient.addColorStop(0,"#0A0A0A");
gradient.addColorStop(1,"#636766");
}else{
gradient.addColorStop(0,"#D1D1D1");
gradient.addColorStop(1,"#F9F9F9");
}
context.fillStyle = gradient;
context.fill();
}
chess.onclick = function(e){
if(over){
return;
}
if(!me){
return;
}
var x = e.offsetX;
var y = e.offsetY;
var i = Math.floor(x / 30);
var j = Math.floor(y / 30);
if(chessBorad[i][j] == 0){
onStep(i,j,me);
chessBorad[i][j]=1;
for(var k=0;k<count;k++){
if(wins[i][j][k]){
myWin[k]++;
computerWin[k]=6;
if(myWin[k]==5){
alert("你赢了");
over = true;
}
}
}
if(!over){
me = !me;
computer();
}
}
}
var computer = function(){
var myScore = [];
var computerScore = [];
var u =0;
var v = 0;
var max = 0;
for(var i=0;i<15;i++){
myScore[i]=[];
computerScore[i]=[];
for(var j=0;j<15;j++){
myScore[i][j]=0;
computerScore[i][j]=0;
}
}
for(var i=0;i<15;i++){
for(var j=0;j<15;j++){
if(chessBorad[i][j]==0){
for(var k=0;k<count;k++){
if(wins[i][j][k]){
if(myWin[k]==1){
myScore[i][j]+=200;
}else if(myWin[k]==2){
myScore[i][j]+=400;
}else if(myWin[k]==3){
myScore[i][j]+=2000;
}else if(myWin[k]==4){
myScore[i][j]+=10000;
}
if(computerWin[k]==1){
computerScore[i][j]+=220;
}else if(computerWin[k]==2){
computerScore[i][j]+=420;
}else if(computerWin[k]==3){
computerScore[i][j]+=2100;
}else if(computerWin[k]==4){
computerScore[i][j]+=20000;
}
}
}
if(myScore[i][j]>max){
max = myScore[i][j];
u = i;
v = j;
}else if(myScore[i][j]==max){
if(computerScore[i][j]>computerScore[u][v]){
u = i;
v = j;
}
}
if(computerScore[i][j]>max){
max = computerScore[i][j];
u = i;
v = j;
}else if(computerScore[i][j]==max){
if(myScore[i][j]>myScore[u][v]){
u = i;
v = j;
}
}
}
}
}
onStep(u,v,false);
chessBorad[u][v]=2;
for(var k=0;k<count;k++){
if(wins[u][v][k]){
computerWin[k]++;
myWin[k]=6;
if(computerWin[k]==5){
alert("你输了");
over = true;
}
}
}
if(!over){
me = !me;
}
};
一生安好
let chessBoard = [];
let me = true;
let over = false;
let wins = [];
let myWin = [];
var computerWin = []
for (var i = 0; i < 15; i++) {
chessBoard[i] = []
for (var j = 0; j < 15; j++) {
chessBoard[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 (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 (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 (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 (k = 0; k < 5; k++) {
wins[i + k][j - k][count] = true
}
count++
}
}
console.log(count)
for (var i = 0; i < count; i++) {
myWin[i] = 0
computerWin[i] = 0
}
var chess = document.getElementById('chess')
var context = chess.getContext('2d')
context.strokeStyle = '#BFBFBF'
var logo = new Image()
logo.src = " " //image path
window.onload = function () {
// context.drawImage(null, 0, 0, 450, 450)
drawChessBoard()
// oneStep(0, 0, true)
// oneStep(1, 1, false)
// context.beginPath()
// context.arc(200,200,100,0,2*Math.PI)
// context.closePath()
// var gradient = context.createRadialGradient(200,200,50,200,200,20)
// gradient.addColorStop(0,'#0A0A0A')
// gradient.addColorStop(1,'#636766')
// context.fillStyle = gradient
// context.fill()
}
var drawChessBoard = function () {
for (var i = 0; i < 15; i++) {
context.moveTo(15 + i * 30, 15) //15
context.lineTo(15 + i * 30, 435) //435
context.stroke()
context.moveTo(15, 15 + i * 30) //15
context.lineTo(435, 15 + i * 30) //435
context.stroke()
}
}
//
// context.moveTo(0,0)
// context.lineTo(450,450)
// context.stroke()
var oneStep = function (i, j, me) {
context.beginPath()
context.arc(15 + i * 30, 15 + j * 30, 13, 0, 2 * Math.PI)
context.closePath()
var gradient = context.createRadialGradient(15 + i * 30 + 2, 15 + j * 30 - 2, 13, 15 + i * 30, 15 + j * 30, 0)
if (me) {
gradient.addColorStop(0, '#0A0A0A')
gradient.addColorStop(1, '#636766')
} else {
gradient.addColorStop(0, '#D1D1D1')
gradient.addColorStop(1, '#F9F9F9')
}
context.fillStyle = gradient
context.fill()
}
chess.onclick = function (e) {
if (over) {
return
}
if (!me) {
return
}
var x = e.offsetX
var y = e.offsetY
var i = Math.floor(x / 30)
var j = Math.floor(y / 30)
if (chessBoard[i][j] === 0) {
oneStep(i, j, me)
// if (me) {
chessBoard[i][j] = 1
// } else {
// chessBoard[i][j] = 2
// }
for (var k = 0; k < count; k++) {
if (wins[i][j][k]) {
myWin[k]++
computerWin[k] = 6
if (myWin[k] === 5) {
window.alert('你赢了')
over = true
}
}
}
if (!over) {
me = !me
computerAI()
}
}
// oneStep(i,j,me)
}
var computerAI = function () {
var myScore = []
var computerScore = []
var max = 0
var u = 0
var v = 0
for (var i = 0; i < 15; i++) {
myScore[i] = []
computerScore[i] = []
for (var j = 0; j < 15; j++) {
myScore[i][j] = 0
computerScore[i][j] = 0
}
}
for (var i = 0; i < 15; i++) {
for (var j = 0; j < 15; j++) {
if (chessBoard[i][j] === 0) {
for (var k = 0; k < count; k++) {
if (wins[i][j][k]) {
if (wins[k] === 1) {
myScore[i][j] += 200
} else if (myWin[k] === 2) {
myScore[i][j] += 400
} else if (myWin[k] === 3) {
myScore[i][j] += 2000
} else if (myWin[k] === 4) {
myScore[i][j] += 10000
}
if (computerWin[k] === 1) {
computerScore[i][j] += 220
} else if (computerWin[k] === 2) {
computerScore[i][j] += 420
} else if (computerWin[k] === 3) {
computerScore[i][j] += 2100
} else if (computerWin[k] === 4) {
computerScore[i][j] += 20000
}
}
}
if (myScore[i][j] > max) {
max = myScore[i][j]
u = i
v = j
} else if (myScore[i][j] === max) {
if (computerScore[i][j] > computerScore[u][v]) {
u = i
v = j
}
}
if (computerScore[i][j] > max) {
max = computerScore[i][j]
u = i
v = j
} else if (computerScore[i][j] > max) {
if (computerScore[i][j] > computerScore[u][v]) {
u = i
v = j
}
}
}
}
}
oneStep(u, v, false)
chessBoard[u][v] = 2
for (var k = 0; k < count; k++) {
if (wins[u][v][k]) {
computerWin[k]++
myWin[k] = 6
if (computerWin[k] === 5) {
window.alert('AI赢了')
over = true
}
}
}
if (!over) {
me = !me
// computerAI()
}
}
慕的地2359295
把不同难度的计算权重分值更改一下,比如简单电脑,专注进攻,不防守,防守分值调低。
qq_孤岛_12
简单,你在alert之前在执行一次画棋子的操作,就是这个drawChessBoard();放在弹出消息前,就Ok了。
qq_一个人的路上_0
---
冰糖小哥哥
代码不对涩,一步一步仔细检查。
慕粉4178113
宝慕林2917688
var chessBoard=[];
var me=true;
var over=false;
//赢法数组
var wins=[];
//赢法统计数组
var myWin=[];
var computerWin=[];
for(var i=0;i<15;i++){
chessBoard[i]=[];
for(var j=0;j<15;j++){
chessBoard[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++){
//wins[0][0][0]=true
//wins[0][1][0]=true
//wins[0][2][0]=true
//wins[0][3][0]=true
//wins[0][4][0]=true
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(count);
for(var i=0;i<count;i++){
myWin[i]=0;
computerWin[i]=0;
}
var chess=document.getElementById('chess');
var context=chess.getContext('2d');
context.strokeStyle="#BFBFBF";
var logo=new Image();
logo.src="image/logo.jpg";
logo.onload=function(){
//绘制北背景图
context.drawImage(logo,0,0,450,450);
//绘制五子棋棋盘
drawChessBoard();
}
var drawChessBoard=function(){
for(var i=0;i<15 ;i++){
context.moveTo(15+i*30,15);
context.lineTo(15+i*30,435);
context.stroke();
context.moveTo(15,15+i*30);
context.lineTo(435,15+i*30);
context.stroke();//stroke是用来描边的
}
}
var oneStep=function(i,j,me){
//绘制棋子
context.beginPath();
context.arc(15+i*30,15+j*30,13,0,2* Math.PI);
context.closePath();
//绘制棋子颜色渐变
var gradient= context.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,"#636766");
}else{
gradient.addColorStop(0,"#D1D1D1");
gradient.addColorStop(1,"#F9F9F9");
}
context.fillStyle=gradient;
context.fill();//fill是用来填充的
}
chess.onclick=function(e){
if(over){
return ;
}
if(!me){
return ;
}
var x=e.offsetX;//设置坐标
var y=e.offsetY;
var i=Math.floor(x/30);
var j=Math.floor(y/30);
if(chessBoard[i][j]==0){
oneStep(i,j,me);
chessBoard[i][j]=1;
for(var k=0;k<count;k++){
if(wins[i][j][k]){
myWin[k]++;
computerWin[k]=6;
if(myWin[k]==5){
window.alert("你赢了");
over=true;
}
}
}
if(!over){
me!=me;
computerAI();
}
}
}
var computerAI=function(){
var myScore=[];
var computerScore=[];
var max=0;
var u=0,v=0;
for(var i=0;i<15;i++){
myScore[i]=[];
computerScore[i]=[];
for(var j=0;j<15;j++){
myScore[i][j]=0;
computerScore[i][j]=0;
}
}
for(var i=0;i<15;i++){
for(var j=0;j<15;j++){
if(chessBoard[i][j]==0){
for(var k=0;k<count;k++){
if(wins[i][j][k]){
if(myWin[k]==1){
myScore[i][j]+=200;
}else if(myWin[k]==2){
myScore[i][j]+=400;
}else if(myWin[k]==3){
myScore[i][j]+=2000;
}else if(myWin[k]==4){
myScore[i][j]+=10000;
}
if(computerWin[k]==1){
computerScore[i][j]+=220;
}else if(computerWin[k]==2){
computerScore[i][j]+=420;
}else if(computerWin[k]==3){
computerScore[i][j]+=2100;
}else if(computerWin[k]==4){
computerScore[i][j]+=20000;
}
}
}
if(myScore[i][j]>max){
max=myScore[i][j];
u=i;
v=j;
}else if(myScore[i][j]==max){
if(computerScore[i][j]>computerScore[u][v]){
u=i;
v=j;
}
}
if(computerScore[i][j]>max){
max=computerScore[i][j];
u=i;
v=j;
}else if(computerScore[i][j]==max){
if(computerScore[i][j]>myScore[u][v]){
u=i;
v=j;
}
}
}
}
}
oneStep(u,v,false);
chessBoard[u][v]=2;
for(var k=0;k<count;k++){
if(wins[u][v][k]){
computerWin[k]++;
myWin[k]=6;
if(computerWin[k]==5){
window.alert("计算机赢了");
over=true;
}
}
}
if(!over){
me!=me;
}
}
慕粉1522128115
野生前端菜鸟
UI设计的时候应该就出问题了
慕粉2253287252
我是自己实现算法的,判断空棋的位置,比如这个落子点:以它为中心,米(横竖斜是不是有同色的,如果有一条直线上面有5颗,就赢了)。这样更容易理解。
qq_CM_9
按照这个老师的代码打的,就出现那这个问题了,有人说本来就应该有,我也不知道,找了其他人的,也是有必赢的那几步,电脑不会在那一次的关键时候拦截你
善良的兔子

各种输~!!被动防御,不过学习算法也是好的~!!
秦嘉鹏
你肯定是在哪步写错了,给你提供完整的参考代码吧!
index.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>五子棋</title> <link rel="stylesheet" href="css/style.css" /> </head> <body> <canvas id="chess" height="450px" width="450px"></canvas> <script type="text/javascript" src="js/script.js"></script> </body> </html>
style.css
canvas{
display: block;
margin:50px auto;
box-shadow: -2px -2px 2px #EFEFEF, 5px 5px 5px #B9B9B9;
}script.js
var chess = document.getElementById('chess');
var context = chess.getContext('2d');
var logo = new Image();
logo.src = 'image/2.png';
//图片加载完成
logo.onload = function(){
//绘制图片
context.drawImage( logo, 0, 0, 450, 450);
//绘制棋盘
drawChessBoard();
}
//设置颜色
context.strokeStyle = '#AAA';
//绘制棋盘的方法
var drawChessBoard = function(){
for(var i=0; i<15; i++ ){
//丛线
context.moveTo(15 + i*30, 15);
context.lineTo(15 + i*30, 435);
//横线
context.moveTo(15, 15 + i*30);
context.lineTo(435, 15 + i*30);
//执行绘制操作(描边)
context.stroke();
}
}
//旗子绘制
var oneStep = function(i , j, me){
context.beginPath();
context.arc(15 + i*30, 15 + j*30, 13, 0, 2 * Math.PI);
context.closePath();
//渐变
var gradient = context.createRadialGradient(15 + i*30 + 2, 15 + j*30 - 2, 13, 15 + i*30 + 2, 15 + j*30 - 2, 0);
if(me){
gradient.addColorStop(0,'#000');
gradient.addColorStop(1,'#666');
}else{
gradient.addColorStop(0,'#DDD');
gradient.addColorStop(1,'#FFF');
}
//填充颜色设置
context.fillStyle = gradient;
//执行绘制操作(填充)
context.fill();
}
//落子设置 默认黑旗 true 黑 false 白
var me = true;
//存储棋盘交叉点坐标(二维数组)
var chessBoard = [];
for(var i=0; i<15; i++){
//第一维 数组
chessBoard[i] = [];
for(var j=0; j<15; j++){
//坐标上存默认值 0
chessBoard[i][j] = 0;
}
}
//赢法数组 三维数组
var wins = [];
for(var i=0; i<15; i++){
//第一维数组
wins[i] = [];
for(var j=0; j<15; j++){
//第二维数组
wins[i][j] = [];
}
}
//赢法种类索引
var count = 0;
//15*15 纵向赢法 165 种
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++;
}
}
//15*15 横向赢法 165 种
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++;
}
}
//15*15 斜向赢法 121 种
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++;
}
}
//15*15 反斜向赢法 121 种
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.dir(wins);
//document.title = count;
//人的赢法统计数组
var myWin = [];
//计算机的赢法统计数组
var computerWin = [];
//表示旗有没有结束
var over = false;
for(var i=0; i<count; i++){
myWin[i] = 0;
computerWin[i] = 0;
}
chess.onclick = function(e){
//判断旗是否结束
if(over){
return;
}
//判断是否黑子下棋
if(!me){
return;
}
//事件兼容处理
var e = e || event;
var x = e.offsetX;
var y = e.offsetY;
var i = Math.floor(x / 30);
var j = Math.floor(y / 30);
//如果该坐标没有落子才可以落子
if(chessBoard[i][j]==0){
oneStep(i, j, me);
//如果落下的是黑子 在坐标存1
chessBoard[i][j] = 1;
//赢法统计
for(var k=0; k<count; k++){
if(wins[i][j][k]){
myWin[k]++;
//该赢法计算机不可能再赢了
computerWin[k] = 6;
//
if(myWin[k] == 5){
window.alert("黑旗赢了");
over = true;
}
}
}
//如果赢法统计完成旗没有结束
if(!over){
computerAI();
me = !me;
}
}
}
//计算机下旗
var computerAI = function(){
//记录人下的旗子
var myScore = [];
//记录计算机下的旗子
var computerScore = [];
//保存最高分数
var max = 0;
//最高分数点坐标
var maxX = 0,maxY = 0;
for(var i=0; i<15; i++){
myScore[i] = [];
computerScore[i] = [];
for(var j=0; j<15; j++){
myScore[i][j] = 0;
computerScore[i][j] = 0;
}
}
//遍历整个棋盘
for(var i=0; i<15; i++){
for(var j=0; j<15; j++){
//该坐标可以落子
if(chessBoard[i][j] == 0){
//遍历所有赢法
for(var k=0; k<count; k++){
//判断第K种赢法是否有价值
if(wins[i][j][k]){
//判断第K种赢发黑旗是否落子
//拦截价值判断
if(myWin[k] == 1){
//拦截
myScore[i][j] += 200;
}else if(myWin[k] == 2){
//拦截
myScore[i][j] += 400;
}else if(myWin[k] == 3){
//拦截
myScore[i][j] += 2000;
}else if(myWin[k] == 4){
//拦截
myScore[i][j] += 10000;
}
//计算机本身落子价值判断
if(computerWin[k] == 1){
//落子价值
computerScore[i][j] += 220;
}else if(computerWin[k] == 2){
//落子价值
computerScore[i][j] += 420;
}else if(computerWin[k] == 3){
//落子价值
computerScore[i][j] += 2100;
}else if(computerWin[k] == 4){
//落子价值
computerScore[i][j] += 20000;
}
}
}
//存储最高分数
if(myScore[i][j] > max){
max = myScore[i][j];
maxX = i;
maxY = j;
}else if(myScore[i][j] == max){
if(computerScore[i][j] > computerScore[maxX][maxY]){
maxX = i;
maxY = j;
}
}
//存储最高分数
if(computerScore[i][j] > max){
max = computerScore[i][j];
maxX = i;
maxY = j;
}else if(computerScore[i][j] == max){
if(myScore[i][j] > myScore[maxX][maxY]){
maxX = i;
maxY = j;
}
}
}
}
}
//计算机子
oneStep(maxX, maxY, false);
chessBoard[maxX][maxY] = 2;
document.title = 'x'+maxX+' Y'+maxY;
console.dir(chessBoard[maxX][maxY]);
//赢法统计
for(var k=0; k<count; k++){
if(wins[maxX][maxY][k]){
//白子赢法更近一步
computerWin[k]++;
//该赢法黑旗不可能再赢了
myWin[k] = 6;
//
if(computerWin[k] == 5){
window.alert("白旗赢了");
over = true;
}
}
}
//如果赢法统计完成旗没有结束
if(!over){
me = !me;
}
}
李占山
var me = true;
var chessBoard = [];
var over = false;
var wins = [];
var myWin = [];
var computerWin = [];
for(var i=0; i<17; i++){
chessBoard[i] = [];
for(var j=0; j<17; j++){
chessBoard[i][j] = 0;
}
}
for(var i=0; i<17; i++){
wins[i] = [];
for(var j=0; j<17; j++){
wins[i][j] = [];
}
}
var count = 0;
for(var i=0; i<17; 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<17; 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++;
}
}
for(var i=0; i<count; i++){
myWin[i] = 0;
computerWin[i] = 0;
}
var chess = document.getElementById('chess')
var context = chess.getContext('2d')
context.strokeStyle = '#bfbfbf';
var logo = new Image();
logo.src = 'img/logo.png';
logo.onload = function (){
context.drawImage(logo, 0, 0, 340, 340);
drawChessBoard();
}
var drawChessBoard = function (){
for(var i =0; i< 17; i++){
context.moveTo(17 + i*20, 17);
context.lineTo(17 + i*20, 337);
context.stroke();
context.moveTo(17, 17 + i*20);
context.lineTo(337, 17 + i*20);
context.stroke();
}
}
var oneStep = function(i, j, me){
context.beginPath();
context.arc(17 + i*20, 17 + j*20, 9, 0, 2 * Math.PI);
context.closePath();
var gradient = context.createRadialGradient(17 + i*20 +2, 17 + j*20 - 2, 9, 17 + i*20 + 2, 17 + j*20 - 2, 0);
if(me){
gradient.addColorStop(0, '#0a0a0a');
gradient.addColorStop(1, '#636766');
}else{
gradient.addColorStop(0, '#d1d1d1');
gradient.addColorStop(1, '#f9f9f9');
}
context.fillStyle = gradient;
context.fill();
}
chess.onclick = function(e){
if(over){
return;
}
if(!me){
return;
}
var x = e.offsetX;
var y = e.offsetY;
var i = Math.floor(x / 20);
var j = Math.floor(y / 20);
if(chessBoard[i][j] == 0){
oneStep(i , j, me);
chessBoard[i][j] = 1;
for( var k=0; k<count; k++){
if(wins[i][j][k]){
myWin[k]++;
computerWin[k] == 6;
if(myWin[k] == 5){
window.alert('你赢了!');
over = true;
}
}
}
if(!over){
me = !me;
computerAI();
}
}
}
var computerAI = function() {
var myScore = [];
var computerScore = [];
var max = 0;
var u = 0, v = 0;
for(var i=0; i<17; i++){
myScore[i] = [];
computerScore[i] = [];
for(var j=0; j<17; j++){
myScore[i][j] = 0;
computerScore[i][j] = 0;
}
}
for(var i=0; i<17; i++){
for(var j=0; j<17; j++){
if(chessBoard[i][j] == 0){
for(var k=0; k<count; k++){
if(wins[i][j][k]){
if(myWin[k] == 1){
myScore[i][j] += 200;
}else if(myWin[k] == 2){
myScore[i][j] += 400;
}else if(myWin[k] == 3){
myScore[i][j] += 2000;
}else if(myWin[k] == 4){
myScore[i][j] += 10000;
}
if(computerWin[k] == 1){
computerScore[i][j] += 220;
}else if(computerWin[k] == 2){
computerScore[i][j] += 420;
}else if(computerWin[k] == 3){
computerScore[i][j] += 2200;
}else if(computerWin[k] == 4){
computerScore[i][j] += 20000;
}
}
}
if(myScore[i][j] > max){
max = myScore[i][j];
u = i;
v = j;
}else if(myScore[i][j] == max){
if(computerScore[i][j] > computerScore[u][v]){
u = i;
v = j;
}
}
if(computerScore[i][j] > max){
max = computerScore[i][j];
u = i;
v = j;
}else if(computerScore[i][j] == max){
if(myScore[i][j] > myScore[u][v]){
u = i;
v = j;
}
}
}
}
}
oneStep(u, v,false);
chessBoard[u][v] = 2;
for( var k=0; k<count; k++){
if(wins[u][v][k]){
computerWin[k]++;
myWin[k] == 6;
if(computerWin[k] == 5){
window.alert('你输了!');
over = true;
}
}
}
if(!over){
me = !me;
}
}
这是我的,里面的布局我改了一下,整体没变,你看一下
小丶白鼠
那就是代码问题咯
慕粉3277066
qq_努力的小菜鸟_0
创建数组将每一步黑棋和白棋的位置记录下来,悔棋的时候直接删除最后的记录,然后重画之前的所有棋子
机智的程序员小熊
ctrl键多选
慕少5506719
点击同一个点的处理逻辑,在chess.onclick()逻辑里要先处理,如果发现是已经点击过的点,就直接return掉;点是否已经有子的逻辑需要存储起来,后续使用时查找即可。
喝两口我请客
你都不贴代码出来,谁知道什么问题。 正常代码如下:
var over = false;
var me = true; //我
var chressBord = [];//棋盘
for(var i = 0; i < 15; i++){
chressBord[i] = [];
for(var j = 0; j < 15; j++){
chressBord[i][j] = 0;
}
}
//赢法的统计数组
var myWin = [];
var computerWin = [];
//赢法数组
var wins = [];
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++;
}
}
for(var i = 0; i < count; i++){
myWin[i] = 0;
computerWin[i] = 0;
}
var chess = document.getElementById("chess");
var context = chess.getContext('2d');
context.strokeStyle = '#bfbfbf'; //边框颜色
var logo = new Image();
logo.src = 'img/logo.png';
logo.onload = function(){
context.drawImage(logo,0,0,450,450);
drawChessBoard();
}
document.getElementById("restart").onclick = function(){
window.location.reload();
}
chess.onclick = function(e){
if(over){
return;
}
if(!me){
return;
}
var x = e.offsetX;
var y = e.offsetY;
var i = Math.floor(x / 30);
var j = Math.floor(y / 30);
if(chressBord[i][j] == 0){
oneStep(i,j,me);
chressBord[i][j] = 1;//我
for(var k = 0; k < count; k++){
if(wins[i][j][k]){
myWin[k]++;
computerWin[k] = 6;//这个位置对方不可能赢了
if(myWin[k] == 5){
window.alert('你赢了');
over = true;
}
}
}
if(!over){
me = !me;
computerAI();
}
}
}
//计算机下棋
var computerAI = function (){
var myScore = [];
var computerScore = [];
var max = 0;
var u = 0, v = 0;
for(var i = 0; i < 15; i++){
myScore[i] = [];
computerScore[i] = [];
for(var j = 0; j < 15; j++){
myScore[i][j] = 0;
computerScore[i][j] = 0;
}
}
for(var i = 0; i < 15; i++){
for(var j = 0; j < 15; j++){
if(chressBord[i][j] == 0){
for(var k = 0; k < count; k++){
if(wins[i][j][k]){
if(myWin[k] == 1){
myScore[i][j] += 200;
}else if(myWin[k] == 2){
myScore[i][j] += 400;
}else if(myWin[k] == 3){
myScore[i][j] += 2000;
}else if(myWin[k] == 4){
myScore[i][j] += 10000;
}
if(computerWin[k] == 1){
computerScore[i][j] += 220;
}else if(computerWin[k] == 2){
computerScore[i][j] += 420;
}else if(computerWin[k] == 3){
computerScore[i][j] += 2100;
}else if(computerWin[k] == 4){
computerScore[i][j] += 20000;
}
}
}
if(myScore[i][j] > max){
max = myScore[i][j];
u = i;
v = j;
}else if(myScore[i][j] == max){
if(computerScore[i][j] > computerScore[u][v]){
u = i;
v = j;
}
}
if(computerScore[i][j] > max){
max = computerScore[i][j];
u = i;
v = j;
}else if(computerScore[i][j] == max){
if(myScore[i][j] > myScore[u][v]){
u = i;
v = j;
}
}
}
}
}
oneStep(u,v,false);
chressBord[u][v] = 2;
for(var k = 0; k < count; k++){
if(wins[u][v][k]){
computerWin[k]++;
myWin[k] = 6;//这个位置对方不可能赢了
if(computerWin[k] == 5){
window.alert('计算机赢了');
over = true;
}
}
}
if(!over){
me = !me;
}
}
//绘画棋盘
var drawChessBoard = function(){
for(var i = 0; i < 15; i++){
context.moveTo(15 + i * 30 , 15);
context.lineTo(15 + i * 30 , 435);
context.stroke();
context.moveTo(15 , 15 + i * 30);
context.lineTo(435 , 15 + i * 30);
context.stroke();
}
}
//画旗子
var oneStep = function(i,j,me){
context.beginPath();
context.arc(15 + i * 30, 15 + j * 30, 13, 0, 2 * Math.PI);//画圆
context.closePath();
//渐变
var gradient = context.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,'#636766');
}else{
gradient.addColorStop(0,'#d1d1d1');
gradient.addColorStop(1,'#f9f9f9');
}
context.fillStyle = gradient;
context.fill();
}
luke_zhou
恩,我知道了。
问题出在我们初始化棋盘的线时,没有设置
context.beginPath();和context.endPath();