English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
L'effetto è il seguente:
Il codice è il seguente:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> #canvasWrap{ larghezza: 600px; altezza: 550px; margine: 50px auto; } #currActive{ dimensione carattere: 20px; peso carattere: bold; /*allineamento testo: centro;*/ margine sinistro: 230px; } #canvas{ flottante: sinistra; sfondo: #EAC591; } #panel{ larghezza: 80px; padding: 10px; float: right; } #ul{ list-style: none; margin: 0; padding: 0; } #ul li{ padding: 2px; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> </head> <body> <div id="canvasWrap"> <div id="currActive"></div> <canvas id="canvas" width="500" height="550"></canvas> <div id="panel"> <ul id="ul"></ul> </div> </div> <script> var obj = {}; // 初始化 obj.init = function(args){ var canvas = document.getElementById("canvas"); this.ctx = canvas.getContext("2d"); // this.chunk =args&&args.chunk?args.chunk:50; // this.radius =args&&args.radius?args.radius:23; // this.CandidateCircleR =args&&args.ccr?args.ccr:5; this.radius = 23; this.chunk =50; this.CandidateCircleR = 5; $("#currActive").text("rosso"); this.steps = []; // 记录步骤 this.currActive = "red"; // 先手 this.init_back(); this.init_chess(); $(canvas).unbind(); this.addEvent(); } // 初始化棋盘 obj.init_back = function(){ this.drawRowLine(); this.drawColLine(); this.ctx.clearRect(this.chunk+1, this.chunk*5+1, this.chunk*8-2, this.chunk-2); this.drawsharpS(); this.drawX(); this.drawText(); } // 初始化棋子 obj.init_chess = function(){ var Car_b1 = {x:1,y:1,text:"車"} var Horse_b1 = {x:2,y:1,text:"馬"} var Elephant_b1 = {x:3,y:1,text:"象"} var Scholar_b1 = {x:4,y:1,text:"士"} var Boss_b = {x:5,y:1,text:"将"} var Scholar_b2 = {x:6,y:1,text:"士"} var Elephant_b2 = {x:7,y:1,text:"象"} var Horse_b2 = {x:8,y:1,text:"馬"} var Car_b2 = {x:9,y:1,text:"車"} var Cannon_b1 = {x:2,y:3,text:"炮"} var Cannon_b2 = {x:8,y:3,text:"炮"} var Soldier_b1 = {x:1,y:4,text:"卒"} var Soldier_b2 = {x:3,y:4,text:"卒"} var Soldier_b3 = {x:5,y:4,text:"卒"} var Soldier_b4 = {x:7,y:4,text:"卒"} var Soldier_b5 = {x:9,y:4,text:"卒"} var Car_r1 = {x:1,y:10,text:"車"} var Horse_r1 = {x:2,y:10,text:"馬"} var Elephant_r1 = {x:3,y:10,text:"相"} var Scholar_r1 = {x:4,y:10,text:"仕"} var Boss_r = {x:5,y:10,text:"帅"} var Scholar_r2 = {x:6,y:10,text:"仕"} var Elephant_r2 = {x:7,y:10,text:"相"} var Horse_r2 = {x:8,y:10,text:"馬"} var Car_r2 = {x:9,y:10,text:"車"} var Cannon_r1 = {x:2,y:8,text:"炮"} var Cannon_r2 = {x:8,y:8,text:"炮"} var Soldier_r1 = {x:1,y:7,text:"兵"} var Soldier_r2 = {x:3,y:7,text:"兵"} var Soldier_r3 = {x:5,y:7,text:"兵"} var Soldier_r4 = {x:7,y:7,text:"兵"} var Soldier_r5 = {x:9,y:7,text:"兵"} this.cheer_arr_B = [Car_b1, Horse_b1, Elephant_b1, Scholar_b1, Boss_b, Scholar_b2, Elephant_b2, Horse_b2, Car_b2, Cannon_b1, Cannon_b2, Soldier_b1, Soldier_b2, Soldier_b3, Soldier_b4, Soldier_b5]; this.cheer_arr_R = [Car_r1, Horse_r1, Elephant_r1, Scholar_r1, Boss_r, Scholar_r2, Elephant_r2, Horse_r2, Car_r2, Cannon_r1, Cannon_r2, Soldier_r1, Soldier_r2, Soldier_r3, Soldier_r4, Soldier_r5]; var that = this; $.each(this.cheer_arr_B, function(i, e) { e.color = "#000"; e.bgcolor = "#fff"; e.bgColor_b = "#000"; e.type = "black"; that.drawPiece(e); that.drawChessText(e); }); $.each(this.cheer_arr_R, function(i, e) { e.color = "#f00"; e.bgcolor = "#fff"; e.bgColor_b = "#f00"; e.type = "red"; that.drawPiece(e); that.drawChessText(e); }); this.cheer_arr_ALL = this.cheer_arr_B.concat(this.cheer_arr_R); } // Aggiorna la partita di scacchi obj.updateChess = function() { this.ctx.clearRect(0, 0, canvas.width, canvas.height); this.init_back(); var that = this; $.each(this.cheer_arr_ALL,function(i,e){ that.drawPiece(e); that.drawChessText(e); }); $("#ul").empty(); $.each(this.steps,function(iii,eee){ $("#ul").append("<li>"+eee+"</li>"); }); } // disegna linea orizzontale obj.drawRowLine = function(){ for(var i =1;i<=10;i++){ this.drawLine(1,i,9,i); } } // disegna linea verticale obj.drawColLine = function(){ for(var i =1;i<=9;i++){ this.drawLine(i,1,i,10); } } // disegna linea obj.drawLine = function(x0,y0,x1,y1,lw){ var x0 = x0*this.chunk; var y0 = y0*this.chunk; var x1 = x1*this.chunk; var y1 = y1*this.chunk; this.ctx.beginPath(); this.ctx.strokeStyle = “#000”; this.ctx.lineWidth = lw?lw:1; this.ctx.moveTo(x0,y0); this.ctx.lineTo(x1,y1); this.ctx.stroke(); this.ctx.closePath(); } // disegna # obj.drawsharpS = function(){ this.round(2,3); this.round(8,3); this.round(1,4); this.round(3,4); this.round(5,4); this.round(7,4); this.round(9,4); this.round(2,8); this.round(8,8); this.round(1,7); this.round(3,7); this.round(5,7); this.round(7,7); this.round(9,7); } // disegna singolo # obj.round = function(x0,y0){ var x0 = x0*this.chunk; var y0 = y0*this.chunk; this.ctx.beginPath(); this.ctx.strokeStyle = “#000”; this.ctx.lineWidth = 1; if(x0!=this.chunk){ // sinistra in alto this.ctx.moveTo(x0-5,y0-10); this.ctx.lineTo(x0-5,y0-5); this.ctx.lineTo(x0-10,y0-5); // 左下 this.ctx.moveTo(x0-5,y0+10); this.ctx.lineTo(x0-5,y0+5); this.ctx.lineTo(x0-10,y0+5); } if(x0!=this.chunk*9){ // 右上 this.ctx.moveTo(x0+5,y0-10); this.ctx.lineTo(x0+5,y0-5); this.ctx.lineTo(x0+10,y0-5); // 右下 this.ctx.moveTo(x0+5,y0+10); this.ctx.lineTo(x0+5,y0+5); this.ctx.lineTo(x0+10,y0+5); } this.ctx.stroke(); this.ctx.closePath(); } // 画X obj.drawX = function(){ this.drawLine(4,1,6,3,0.5); this.drawLine(4,3,6,1,0.5); this.drawLine(4,8,6,10,0.5); this.drawLine(4,10,6,8,0.5); } // 画楚河/漢界 obj.drawText = function(){ this.ctx.font = "bold 30px Courier New"; this.ctx.fillStyle = "#000"; this.ctx.fillText("楚 河", this.chunk*2, this.chunk*5+this.chunk/2+10); this.ctx.fillText("漢 界", this.chunk*6, this.chunk*5+this.chunk/2+10); this.ctx.font = "12px Courier New"; this.text_arr =["九","八","七","六","五","四","三","二","一"]; for(var i=0;i<9;i++){ this.ctx.fillText((i+1).toString(), this.chunk*(i+1)-5, 20); this.ctx.fillText(this.text_arr[i], this.chunk*(i+1)-5, this.chunk*10+30+10); } } // 画棋子形状 obj.drawPiece = function(e){ this.ctx.beginPath(); this.ctx.fillStyle =e.bgcolor; this.ctx.strokeStyle = e.bgColor_b; this.ctx.lineWidth =2; this.ctx.arc(e.x*this.chunk, e.y*this.chunk, this.radius, 0, Math.PI * 2, true); this.ctx.closePath(); this.ctx.fill(); this.ctx.stroke(); } // 画棋子文字 obj.drawChessText = function(e){ this.ctx.font = "bold 30px Courier New"; this.ctx.fillStyle = e.color; var offset = this.ctx.measureText(e.text).width/2; this.ctx.fillText(e.text, e.x*this.chunk-offset, e.y*this.chunk+10); } // 增加点击事件 obj.addEvent = function(){ var that = this; this.checked = false; $(canvas).on("mousedown",function(ev){ for(var j=1;j<=10;j++){ for(var i=1;i<=9;i++){ var temp_i = i*that.chunk; var temp_j = j*that.chunk; var distanct = Math.sqrt(Math.pow(temp_i-ev.offsetX,2)+Math.pow(temp_j-ev.offsetY,2)); if(distanct<=that.radius){ var overChess = false; $.each(that.cheer_arr_ALL,function(ii,ee){ if(ee.x ==i&&ee.y==j){ overChess = true; var p ={x:ee.x,y:ee.y}; // console.log(that.checked); if(that.currActive != ee.type&&!that.checked){ return false; } if(!that.checked){ // console.log("选中一个棋子"); that.drawCandidate(); // 是否能吃子 if(that.Eat_rule(i,j)){ // console.log("点在原棋子上"); }else if(that.preChess.type == ee.type){ // console.log("切换棋子"); that.updateChess(); that.checked = false; that.drawChecked(p); that.preChess = ee; that.updateChess(); that.drawCandidate(); // 是否能吃子 if(that.Eat_rule(i,j)){ } else if(that.preChess.text == "帅"){ // 对将 } that.eat(ii,ee,i,j); if(eee.text == "将"){ if(that.preChess.x == i){ var canEat =true; $.each(that.cheer_arr_ALL, function(iii, eee){ if(eee.x ==that.preChess.x&&eee.y==j){ for(var t=that.preChess.y-1;t>j;t--){ else if(that.preChess.text == "将"){ if(that.inArray(that.preChess.x,t)){ canEat = false; break; } } } canEat = false; } return false; } }); if(canEat){ that.eat(ii,ee,i,j); } } } if(that.preChess.x == i){ var canEat =true; $.each(that.cheer_arr_ALL, function(iii, eee){ if(eee.x ==that.preChess.x&&eee.y==j){ if(eee.text == "帅"){ for(var t=that.preChess.y+1;t<j;t++){ if(that.inArray(that.preChess.x,t)){ canEat = false; break; } } } canEat = false; } return false; } }); if(canEat){ that.eat(ii,ee,i,j); } } } } return false; } }); if(overChess){ // alert("点在棋子上"); } // 是否能移动 if(that.checked&&that.Move_rule(i,j)){ // console.log("移动棋子"); that.move(i,j); } } } } } }); } // 记谱 obj.note = function(ee,i,j){ var distance = Math.abs(ee.y-j); var step; if(ee.type=="red"){ $("#currActive").text("黑方"); var oldP = this.text_arr[ee.x-1]; var newP = this.text_arr[i-1]; var num = this.text_arr[9-distance]; if(j<ee.y){ if(ee.x == i){ console.log(ee.text+oldP+"进"+num); step = ee.text+oldP+"进"+num; } console.log(ee.text+oldP+"进"+newP); step = ee.text+oldP+"进"+newP; } }else if(j>ee.y){ if(ee.x == i){ console.log(ee.text+oldP+"退"+num); step = ee.text+oldP+"退"+num; } console.log(ee.text+oldP+"退"+newP); step = ee.text+oldP+"退"+newP; } } console.log(ee.text+oldP+"平"+newP); step = ee.text+oldP+"平"+newP; } } $("#currActive").text("rosso"); if(j>ee.y){ if(ee.x == i){ console.log(ee.text+ee.x+"进"+distance); step = ee.text+ee.x+"进"+distance } console.log(ee.text+ee.x+"进"+i); step = ee.text+ee.x+"进"+i; } }else if(j<ee.y){ if(ee.x == i){ console.log(ee.text+ee.x+"退"+distance); step = ee.text+ee.x+"退"+distance; } console.log(ee.text+ee.x+"退"+i); step = ee.text+ee.x+"退"+i; } } console.log(ee.text+ee.x+"平"+i); step = ee.text+ee.x+"平"+i; } } this.steps.push(step); } // 是否结束 obj.isOver = function(ee){ if(ee.text == "将"){ alert("hai vinto"); $("#ul").empty(); return true; }else if(ee.text == "帅"){ alert("hai perso"); $("#ul").empty(); return true; } return false; } } // 吃子 obj.eat = function(ii, ee, i, j){ this.cheer_arr_ALL.splice(ii, 1); this.move(i, j); if(this.isOver(ee)){ this.ctx.clearRect(0, 0, canvas.width, canvas.height); this.init(); return false; }; } // 移动 obj.move = function(i, j){ var that = this; $.each(that.cheer_arr_ALL, function(iii, eee){ if(eee.x == that.preChess.x && eee.y == that.preChess.y){ that.note(eee, i, j); eee.x = i; eee.y = j; that.currActive = eee.type == "red" ? "black" : "red"; return false; } }); that.updateChess(); that.checked = false; } // 绘制选中棋子状态 obj.drawChecked = function(p){ var temp_x = p.x * this.chunk; var temp_y = p.y * this.chunk; this.ctx.beginPath(); this.ctx.strokeStyle = "#00f"; this.ctx.lineWidth = 1; this.ctx.moveTo(temp_x-this.radius, temp_y-this.radius+10); this.ctx.lineTo(temp_x-this.radius, temp_y-this.radius); this.ctx.lineTo(temp_x-this.radius+10, temp_y-this.radius); this.ctx.moveTo(temp_x-this.radius, temp_y+this.radius-10); this.ctx.lineTo(temp_x-this.radius, temp_y+this.radius); this.ctx.lineTo(temp_x-this.radius+10, temp_y+this.radius); this.ctx.moveTo(temp_x+this.radius,temp_y-this.radius+10); this.ctx.lineTo(temp_x+this.radius,temp_y-this.radius); this.ctx.lineTo(temp_x+this.radius-10,temp_y-this.radius); this.ctx.moveTo(temp_x+this.radius,temp_y+this.radius-10); this.ctx.lineTo(temp_x+this.radius,temp_y+this.radius); this.ctx.lineTo(temp_x+this.radius-10,temp_y+this.radius); this.ctx.stroke(); this.ctx.closePath(); } // 画候选位置 obj.drawCandidate = function(){ switch(this.preChess.text){ case ‘車’: var temp_y = this.preChess.y; while(!this.inArray(this.preChess.x,++temp_y)&&temp_y<=10){ this.drawCandidateCircle(this.preChess.x,temp_y); } var temp_y = this.preChess.y; while(!this.inArray(this.preChess.x,--temp_y)&&temp_y>0){ this.drawCandidateCircle(this.preChess.x,temp_y); } var temp_x = this.preChess.x; while(!this.inArray(++temp_x,this.preChess.y)&&temp_x<10){ this.drawCandidateCircle(temp_x,this.preChess.y); } var temp_x = this.preChess.x; while(!this.inArray(--temp_x,this.preChess.y)&&temp_x>0){ this.drawCandidateCircle(temp_x,this.preChess.y); } break; case ‘馬’: if(!this.inArray(this.preChess.x-2,this.preChess.y-1) &&this.preChess.x-2>=1&&this.preChess.y-1>=1 &&!this.inArray(this.preChess.x-1,this.preChess.y)){ this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-1); } if(!this.inArray(this.preChess.x-1,this.preChess.y-2) &&this.preChess.x-1>=1&&this.preChess.y-2>=1 &&!this.inArray(this.preChess.x,this.preChess.y-1)){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y-2); } if(!this.inArray(this.preChess.x+1,this.preChess.y-2) &&this.preChess.x+1<=9&&this.preChess.y-2>=1 &&!this.inArray(this.preChess.x,this.preChess.y-1)){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y-2); } if(!this.inArray(this.preChess.x+2,this.preChess.y-1) &&this.preChess.x+2<=9&&this.preChess.y-1>=1 &&!this.inArray(this.preChess.x+1,this.preChess.y)){ this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-1); } if(!this.inArray(this.preChess.x+2,this.preChess.y+1) &&this.preChess.x+2<=9&&this.preChess.y+1<=10 &&!this.inArray(this.preChess.x+1,this.preChess.y)){ this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+1); } if(!this.inArray(this.preChess.x+1,this.preChess.y+2) &&this.preChess.x+1<=9&&this.preChess.y+2<=10 &&!this.inArray(this.preChess.x,this.preChess.y+1)){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y+2); } if(!this.inArray(this.preChess.x-1,this.preChess.y+2) &&this.preChess.x-1>=1&&this.preChess.y+2<=10 &&!this.inArray(this.preChess.x,this.preChess.y+1)){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y+2); } if(!this.inArray(this.preChess.x-2,this.preChess.y+1) &&this.preChess.x-2>=1&&this.preChess.y+1<=10 &&!this.inArray(this.preChess.x-1,this.preChess.y)){ this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+1); } break; case ‘相’: altrimenti se(this.preChess.y==6){ se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } } se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } }altrimenti se(this.preChess.x==1){ se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } }altrimenti se(this.preChess.x==9){ se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } } se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } } break; case ‘象’: se(this.preChess.y==1){ se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } }altrimenti se(this.preChess.y==5){ se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } }altrimenti se(this.preChess.x==1){ se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } }altrimenti se(this.preChess.x==9){ se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } } se(!this.inArray(this.preChess.x+2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y-2); } se(!this.inArray(this.preChess.x+2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+2, this.preChess.y+2); } se(!this.inArray(this.preChess.x-2, this.preChess.y-2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y-2); } se(!this.inArray(this.preChess.x-2, this.preChess.y+2)){ &&!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-2, this.preChess.y+2); } } break; case ‘仕’: if(this.preChess.x==5&&this.preChess.y==9){ se(!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-1, this.preChess.y-1); } if(!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-1, this.preChess.y+1); } if(!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+1, this.preChess.y-1); } if(!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+1, this.preChess.y+1); } } this.disegnaCerchioCandidato(5, 9); } break; case ‘士’: if(this.preChess.x==5&&this.preChess.y==2){ se(!this.inArray(this.preChess.x-1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x-1, this.preChess.y-1); } if(!this.inArray(this.preChess.x-1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x-1, this.preChess.y+1); } if(!this.inArray(this.preChess.x+1, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x+1, this.preChess.y-1); } if(!this.inArray(this.preChess.x+1, this.preChess.y+1)){ this.disegnaCerchioCandidato(this.preChess.x+1, this.preChess.y+1); } } this.disegnaCerchioCandidato(5, 2); } break; case ‘帅’: if(!this.inArray(this.preChess.x, this.preChess.y-1) && this.preChess.y>8){ this.disegnaCerchioCandidato(this.preChess.x, this.preChess.y-1); } if(!this.inArray(this.preChess.x,this.preChess.y+1)&&this.preChess.y<10){ this.drawCandidateCircle(this.preChess.x,this.preChess.y+1); } if(!this.inArray(this.preChess.x-1, this.preChess.y) && this.preChess.x>4){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y); } if(!this.inArray(this.preChess.x+1, this.preChess.y) && this.preChess.x<6){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y); } break; case ‘将’: if(!this.inArray(this.preChess.x, this.preChess.y-1) && this.preChess.y>1){ this.disegnaCerchioCandidato(this.preChess.x, this.preChess.y-1); } if(!this.inArray(this.preChess.x, this.preChess.y+1) && this.preChess.y<3){ this.drawCandidateCircle(this.preChess.x,this.preChess.y+1); } if(!this.inArray(this.preChess.x-1, this.preChess.y) && this.preChess.x>4){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y); } if(!this.inArray(this.preChess.x+1, this.preChess.y) && this.preChess.x<6){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y); } break; caso "Pezzo": if(this.preChess.y>5 && !this.inArray(this.preChess.x, this.preChess.y-1)){ this.disegnaCerchioCandidato(this.preChess.x, this.preChess.y-1); } if(!this.inArray(this.preChess.x, this.preChess.y-1) && this.preChess.y>1){ this.disegnaCerchioCandidato(this.preChess.x, this.preChess.y-1); } if(!this.inArray(this.preChess.x-1,this.preChess.y)&&this.preChess.x>1){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y); } if(!this.inArray(this.preChess.x+1,this.preChess.y)&&this.preChess.x<9){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y); } } break; caso "Pezzo": if(this.preChess.y<=5&&!this.inArray(this.preChess.x,this.preChess.y+1)){ this.drawCandidateCircle(this.preChess.x,this.preChess.y+1); } else if(this.preChess.y>5){ if(!this.inArray(this.preChess.x,this.preChess.y+1)&&this.preChess.y<10){ this.drawCandidateCircle(this.preChess.x,this.preChess.y+1); } if(!this.inArray(this.preChess.x-1,this.preChess.y)&&this.preChess.x>1){ this.drawCandidateCircle(this.preChess.x-1,this.preChess.y); } if(!this.inArray(this.preChess.x+1,this.preChess.y)&&this.preChess.x<9){ this.drawCandidateCircle(this.preChess.x+1,this.preChess.y); } } break; caso "Cannone": var temp_y = this.preChess.y; while(!this.inArray(this.preChess.x,++temp_y)&&temp_y<=10){ this.drawCandidateCircle(this.preChess.x,temp_y); } var temp_y = this.preChess.y; while(!this.inArray(this.preChess.x,--temp_y)&&temp_y>0){ this.drawCandidateCircle(this.preChess.x,temp_y); } var temp_x = this.preChess.x; while(!this.inArray(++temp_x,this.preChess.y)&&temp_x<10){ this.drawCandidateCircle(temp_x,this.preChess.y); } var temp_x = this.preChess.x; while(!this.inArray(--temp_x,this.preChess.y)&&temp_x>0){ this.drawCandidateCircle(temp_x,this.preChess.y); } break; } } // Disegna la forma candidata obj.drawCandidateCircle = function(x,y){ this.ctx.beginPath(); this.ctx.fillStyle =“#eee”; this.ctx.strokeStyle = “#000”; this.ctx.lineWidth =2; this.ctx.arc(x*this.chunk, y*this.chunk, this.CandidateCircleR, 0, Math.PI * 2, true); // this.ctx.translate(x*this.chunk,y*this.chunk); // this.ctx.rotate(45*Math.PI/180); // this.ctx.translate(1*this.chunk,1*this.chunk);//设置画布上的(0,0)位置,也就是旋转的中心点 // this.ctx.rotate(1*Math.PI/180); // this.ctx.fillRect(x*this.chunk-5,y*this.chunk-5,10,10); this.ctx.closePath(); this.ctx.fill(); this.ctx.stroke(); } // 棋子移动规则 obj.Move_rule = function(i,j){ switch(this.preChess.text){ case ‘車’: return this.rule_Car(i,j); case ‘馬’: return this.rule_Horse(i,j); case ‘相’: return this.rule_Elephant_r(i,j); case ‘象’: return this.rule_Elephant_b(i,j); case ‘仕’: return this.rule_Scholar_r(i,j); case ‘士’: return this.rule_Scholar_b(i,j); case ‘帅’: return this.rule_Boss_r(i,j); case ‘将’: return this.rule_Boss_b(i,j); caso "Pezzo": return this.rule_Soldier_r(i, j); caso "Pezzo": return this.rule_Soldier_b(i, j); caso "Cannone": if(this.rule_Cannon(i,j)==0){ return true; } return false; } } // 棋子吃子规则 obj.Eat_rule = function(i,j){ switch(this.preChess.text){ case ‘車’: return this.rule_Car(i,j); case ‘馬’: return this.rule_Horse(i,j); case ‘相’: return this.rule_Elephant_r(i,j); case ‘象’: return this.rule_Elephant_b(i,j); case ‘仕’: return this.rule_Scholar_r(i,j); case ‘士’: return this.rule_Scholar_b(i,j); case ‘帅’: return this.rule_Boss_r(i,j); case ‘将’: return this.rule_Boss_b(i,j); caso "Pezzo": return this.rule_Soldier_r(i, j); caso "Pezzo": return this.rule_Soldier_b(i, j); caso "Cannone": se (this.rule_Cannon(i, j) == 1) { return true; } return false; } } // Regole del Carro obj.rule_Car = function(i, j) { if (this.preChess.x == i || this.preChess.y == j) { if (this.preChess.x == i) { se (this.preChess.y < j) { // console.log("Giù"); var hasObstacle = false; per var p = this.preChess.y + 1; p < j; p++) { se (this.inArray(i, p)) { hasObstacle = true; break; } } if(hasObstacle){ return false; } } se (this.preChess.y > j) { // console.log("Su"); var hasObstacle = false; per var p = this.preChess.y - 1; p > j; p--) { se (this.inArray(i, p)) { hasObstacle = true; break; } } if(hasObstacle){ return false; } } } se (this.preChess.y == j) { se (this.preChess.x < i) { // console.log("Destra"); var hasObstacle = false; per var p = this.preChess.x + 1; p < i; p++) { se (this.inArray(p, j)) { hasObstacle = true; break; } } if(hasObstacle){ return false; } } se (this.preChess.x > i) { // console.log("Sinistra"); var hasObstacle = false; per var p = this.preChess.x - 1; p > i; p--) { se (this.inArray(p, j)) { hasObstacle = true; break; } } if(hasObstacle){ return false; } } } return true; } return false; } // Regole del Cavallo obj.rule_Horse = function(i, j) { var hasObstacle = false; var that = this; se (Math.abs(this.preChess.x - i) == 1 && Math.abs(this.preChess.y - j) == 2) oppure (Math.abs(this.preChess.x - i) == 2 && Math.abs(this.preChess.y - j) == 1) { se (this.preChess.x - i == 2) { // Sinistra $.each(that.cheer_arr_ALL,function(ii,ee){ se (ee.x == that.preChess.x - 1 && ee.y == that.preChess.y) { hasObstacle =true; return false; } }); if(hasObstacle){ return false; } altrimenti se (i - that.preChess.x == 2) { // Destra $.each(that.cheer_arr_ALL,function(ii,ee){ se (ee.x == that.preChess.x + 1 && ee.y == that.preChess.y) { hasObstacle =true; return false; } }); if(hasObstacle){ return false; } }else if(that.preChess.y-j==2){ // 上 $.each(that.cheer_arr_ALL,function(ii,ee){ if(ee.x ==that.preChess.x&&ee.y==that.preChess.y-1){ hasObstacle =true; return false; } }); if(hasObstacle){ return false; } }else if(j-that.preChess.y==2){ // 下 $.each(that.cheer_arr_ALL,function(ii,ee){ if(ee.x ==that.preChess.x&&ee.y==that.preChess.y+1){ hasObstacle =true; return false; } }); if(hasObstacle){ return false; } } return true; } return false; } // 红相的规则 obj.rule_Elephant_r = function(i,j){ var hasObstacle = false; var that = this; if((Math.abs(that.preChess.x-i)==2&&Math.abs(that.preChess.y-j)==2)&&j>=6){ var vgaX = (that.preChess.x+i)/2; var vgaY = (that.preChess.y+j)/2; console.log(vgaX); $.each(that.cheer_arr_ALL,function(ii,ee){ if(ee.x ==vgaX&&ee.y==vgaY){ hasObstacle =true; return false; } }); if(hasObstacle){ return false; } return true; } return false; } // 黑象的规则 obj.rule_Elephant_b = function(i,j){ var hasObstacle = false; var that = this; if((Math.abs(that.preChess.x-i)==2&&Math.abs(that.preChess.y-j)==2)&&j<6){ var vgaX = (that.preChess.x+i)/2; var vgaY = (that.preChess.y+j)/2; // console.log(vgaX); $.each(that.cheer_arr_ALL,function(ii,ee){ if(ee.x ==vgaX&&ee.y==vgaY){ hasObstacle =true; return false; } }); if(hasObstacle){ return false; } return true; } return false; } // 红仕的规则 obj.rule_Scholar_r = function(i,j){ if(this.preChess.x==5&&this.preChess.y==9){ if(Math.abs(this.preChess.x-i)==1&&Math.abs(this.preChess.y-j)==1){ return true; } }else if(i==5&&j==9){ return true; } return false; } // 黑仕的规则 obj.rule_Scholar_b = function(i,j){ if(this.preChess.x==5&&this.preChess.y==2){ if(Math.abs(this.preChess.x-i)==1&&Math.abs(this.preChess.y-j)==1){ return true; } else if(i==5&&j==2){ return true; } return false; } // 帅的规则 obj.rule_Boss_r = function (i, j) { if ((Math.abs(this.preChess.x - i) == 1 && this.preChess.y == j)) { || (this.preChess.x == i && Math.abs(this.preChess.y - j) == 1)) { if (i >= 4 && i <= 6 && j >= 8 && j <= 10) { return true; } return false; } } return false; } // 将的规则 obj.rule_Boss_b = function (i, j) { if ((Math.abs(this.preChess.x - i) == 1 && this.preChess.y == j)) { || (this.preChess.x == i && Math.abs(this.preChess.y - j) == 1)) { if (i >= 4 && i <= 6 && j >= 1 && j <= 3) { return true; } return false; } } return false; } // 兵的规则 obj.rule_Soldier_r = function (i, j) { if (this.preChess.y <= 5) { if ((this.preChess.x == i && this.preChess.y - 1 == j) || (this.preChess.x - 1 == i && this.preChess.y == j) || (this.preChess.x + 1 == i && this.preChess.y == j)) { return true; } } if (this.preChess.x == i && this.preChess.y - 1 == j) { return true; } } return false; } // 卒的规则 obj.rule_Soldier_b = function (i, j) { if (this.preChess.y > 5) { if ((this.preChess.x == i && this.preChess.y + 1 == j) || (this.preChess.x - 1 == i && this.preChess.y == j) || (this.preChess.x + 1 == i && this.preChess.y == j)) { return true; } } if (this.preChess.x == i && this.preChess.y + 1 == j) { return true; } } return false; } // 炮的规则 obj.rule_Cannon = function (i, j) { var that = this; if (this.preChess.x == i || this.preChess.y == j) { var t = 0; if (this.preChess.x == i) { var temp = this.preChess.y; if (temp < j) { while (++temp != j) { $.each(this.cheer_arr_ALL,function(ii,ee){ var temp = this.preChess.x; t++; return false; } }); } return t; } if(ee.x ==that.preChess.x&&ee.y==temp){ $.each(this.cheer_arr_ALL,function(ii,ee){ var temp = this.preChess.x; t++; return false; } }); } return t; } } if(temp<i){ while(++temp!=i){ else{ $.each(this.cheer_arr_ALL,function(ii,ee){ if(ee.x ==temp&&ee.y==that.preChess.y){ t++; return false; } }); } return t; } while(--temp!=i){ $.each(this.cheer_arr_ALL,function(ii,ee){ if(ee.x ==temp&&ee.y==that.preChess.y){ t++; return false; } }); } return t; } } } return 2; } obj.inArray = function(x,y){ var hasObstacle = false; $.each(this.cheer_arr_ALL,function(ii,ee){ if(ee.x ==x&&ee.y==y){ hasObstacle = true; return false; } }); return hasObstacle; } obj.init(); // obj.init({ // chunk:50, // Dimensione della griglia // radius:23, // Raggio della pedina // ccr:3 // Raggio del piccolo cerchio candidato // }); </script> </body> </html>
Questo è tutto il contenuto dell'articolo, spero che il contenuto di questo articolo possa essere di一定的 aiuto per il tuo studio o lavoro, e spero di ricevere un sacco di supporto per il tutorial Yell!
Dichiarazione: il contenuto di questo articolo è stato prelevato da Internet, è di proprietà dei rispettivi autori, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, questo sito non possiede il diritto di proprietà, non è stato elaborato manualmente e non assume alcuna responsabilità legale pertinente. Se trovi contenuti sospetti di copyright, invia un'e-mail a notice#oldtoolbag.com (sostituisci # con @) per segnalare, fornendo prove pertinenti. Una volta verificata, questo sito rimuoverà immediatamente il contenuto sospetto di violazione del copyright.