English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

تحقيق الشطرنج الصيني باستخدام canvas

النتيجة كما يلي:

كود كما يلي:

<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
 <title></title>
 <style>
 #canvasWrap{
  عرض: 600 بكسل;
  ارتفاع: 550 بكسل;
  م margin: 50px auto;
 }
 #currActive{
  حجم الخط: 20 بكسل;
  وزن الخط: سميك;
  /*text-align: center;*/
  م margin-left:230px ;
 }
 #canvas{
  موجود في اليسار;
  خلفية: #EAC591;
 }
 #panel{
  عرض: 80 بكسل;
  حجم التداخل: 10 بكسل;
  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("الفرقة الحمراء");
  this.steps = [];      // تسجيل الخطوات
  this.currActive = "red";  // الأول
  هذا.البدء_الباك();
  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); 
  }
  // تحديث اللعبة
  obj.updateChess = function() {
  هذا.السياق.clearRect(0,0,شاشة_الرسم.العرض,شاشة_الرسم.الارتفاع);
  هذا.البدء_الباك();
  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>");
  });
  }
  // رسم خط أفقي
  obj.drawRowLine = function(){
  للمرةfor(var i =1;i<=10;i++){
   هذا.drawLine(1,i,9,i);
  }
  }
  // رسم خط عمودي
  obj.drawColLine = function(){
  للمرةfor(var i =1;i<=9;i++){
   هذا.drawLine(i,1,i,10);
  }
  }
  // رسم خط
  obj.drawLine = function(x0,y0,x1,y1,lw){
  م変 x0 = x0*هذا.القطعة;
  م変 y0 = y0*هذا.القطعة;
  م变化1 = x1*هذا.القطعة;
  م变化1 = y1*هذا.القطعة;
  this.ctx.beginPath();
  this.ctx.strokeStyle = "#000";
  هذا.ctx.lineWidth =lw?lw:1;
  هذا.ctx.moveTo(x0,y0);
  هذا.ctx.lineTo(x1,y1);
  this.ctx.stroke();
  this.ctx.closePath();
  }
  // رسم #
  obj.drawsharpS = function(){
  هذا.round(2,3);
  هذا.round(8,3);
  هذا.round(1,4);
  هذا.round(3,4);
  هذا.round(5,4);
  هذا.round(7,4);
  هذا.round(9,4);
  هذا.round(2,8);
  هذا.round(8,8);
  هذا.round(1,7);
  هذا.round(3,7);
  هذا.round(5,7);
  هذا.round(7,7);
  هذا.round(9,7);
  }
  // رسم # الواحد
  obj.round = function(x0,y0){
  م変 x0 = x0*هذا.القطعة;
  م変 y0 = y0*هذا.القطعة;
  this.ctx.beginPath();
  this.ctx.strokeStyle = "#000";
  هذا.خط_العرض =1;
  إذا(x0!=هذا.القطعة){
   // أعلى يسار
   هذا.السياق.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);
  }
  إذا(x0!=this.القطعة*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";
    هذا.السياق.fillStyle = "#000";
    هذا.السياق.fillText("النهر الفاصل", هذا.القطعة*2, هذا.القطعة*5+this.القطعة/2+10);
    هذا.السياق.fillText("الحدود الصينية", هذا.القطعة*6, هذا.القطعة*5+this.القطعة/2+10);
    هذا.السياق.font = "12px Courier New";
    هذا.النص_المكون = ["تسعة", "ثمانية", "سبعة", "ستة", "خمسة", "أربعة", "ثلاثة", "اثنان", "واحد"];
    للمحصول على i=0;i<9;i++;
    هذا.السياق.fillText((i+1).toString(), هذا.القطعة*(i+1)-5, 20);
    هذا.السياق.fillText(هذا.النص_المكون[i], هذا.القطعة*(i+1)-5, هذا.القطعة*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)){
      else if(that.preChess.type == ee.type){
     }
//      console.log("تبديل قطعة الشطرنج");
      هذا.تحديث_الخشبة();
      هذا.المختار = غير_صحيح;
     that.drawChecked(p);
that.preChess = ee;
      هذا.تحديث_الخشبة();
      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(هذا.الفرح_الجميع_الخشبة_الاجتماعية,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(هذا.الفرح_الجميع_الخشبة_الاجتماعية,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;
   }
   }
   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("الفرقة الحمراء");
   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;
   }
   }
   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(\"أنت رابح\");
   $("#ul").empty();
   return true;
  \}else if(ee.text == \"帅\"){
   alert(\"أنت خاسر\");
   $("#ul").empty();
   return true;
  }
   return false;
  }
  }
  // تناول قطعة
  obj.eat = function(iii,ee,ا,ج){
  هذا.الفرح_الجميع_الخشبة_الاجتماعية.splice(iii,1);
  هذا.تحريك(ا,ج);
  إذا كان هذا.هل_النهاية(ee)){
   هذا.السياق.clearRect(0,0,شاشة_الرسم.العرض,شاشة_الرسم.الارتفاع);
   هذا.البدء();
   return false;
  };
  }
  // تحريك
  obj.move = function(ا,ج){
  var that = this;
  $.each(هذا.الفرح_الجميع_الخشبة_الاجتماعية,function(iii,eee){
   إذا كان eee.x ==هذا.الخشبة_السابقة.x&&eee.y==هذا.الخشبة_السابقة.y){
   هذا.الملاحظة(eee,ا,ج);
   eee.x= ا;
   eee.y = ج;
   هذا.النشاط_الحالي = eee.النوع=="الاحمر"?"الاسود":"الاحمر";
   return false;
   }
  });
  هذا.تحديث_الخشبة();
  هذا.المختار = غير_صحيح;
  }
  // رسم حالة قطعة الخشبة المختارة
  obj.drawChecked = function(p){
  تعريف_تم_الخط_الاجتماعي_الكسري = p.x*هذا.قطعة;
  تعريف_تم_الخط_الاجتماعي_الكسري = p.y*هذا.قطعة;
  this.ctx.beginPath();
  هذا.لون_الخط = "#00f";
  هذا.خط_العرض =1;
  هذا.السياق.moveTo(تم_الخط_الاجتماعي_الكسري-الشعاع,تم_الخط_الاجتماعي_الكسري-الشعاع+10);
  هذا.السياق.lineTo(تم_الخط_الاجتماعي_الكسري-الشعاع,تم_الخط_الاجتماعي_الكسري-الشعاع);
  هذا.السياق.lineTo(تم_الخط_الاجتماعي_الكسري-الشعاع+10,تم_الخط_الاجتماعي_الكسري-الشعاع);
  هذا.السياق.moveTo(تم_الخط_الاجتماعي_الكسري-الشعاع,تم_الخط_الاجتماعي_الكسري+الشعاع-10);
  هذا.السياق.lineTo(تم_الخط_الاجتماعي_الكسري-الشعاع,تم_الخط_الاجتماعي_الكسري+الشعاع);
  هذا.السياق.lineTo(تم_الخط_الاجتماعي_الكسري-الشعاع+10,تم_الخط_الاجتماعي_الكسري+الشعاع);
  هذا.السياق_الرسمي.moveTo(temp_x+هذا.القطر, temp_y-هذا.القطر+10);
  هذا.السياق_الرسمي.lineTo(temp_x+هذا.القطر, temp_y-هذا.القطر);
  هذا.السياق_الرسمي.lineTo(temp_x+هذا.القطر-10, temp_y-هذا.القطر);
  هذا.السياق_الرسمي.moveTo(temp_x+هذا.القطر, temp_y+هذا.القطر-10);
  هذا.السياق_الرسمي.lineTo(temp_x+هذا.القطر, temp_y+هذا.القطر);
  هذا.السياق_الرسمي.lineTo(temp_x+هذا.القطر-10, temp_y+هذا.القطر);
  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 "馬":
   إذا(!هذا.في_المجموعة(هذا.القطعة_السابقة.الكسور-2, هذا.القطعة_السابقة.الصادف-1)
   &&هذا.القطعة_السابقة.الكسور-2>=1&&هذا.القطعة_السابقة.الصادف-1>=1
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x-1, هذا. المسبق_الشطرنجي. y)){
    هذا. رسم_دائرة_المرشح(هذا.القطعة_السابقة.الكسور-2, هذا.القطعة_السابقة.الصادف-1);
   }
   إذا(!هذا.في_المجموعة(هذا.القطعة_السابقة.الكسور-1, هذا.القطعة_السابقة.الصادف-2)
   &&هذا.القطعة_السابقة.الكسور-1>=1&&هذا.القطعة_السابقة.الصادف-2>=1
   &&!هذا.في_المجموعة(هذا.القطعة_السابقة.الكسور, هذا.القطعة_السابقة.الصادف-1)){
    هذا. رسم_دائرة_المرشح(هذا.القطعة_السابقة.الكسور-1, هذا.القطعة_السابقة.الصادف-2);
   }
   إذا(!هذا.في_المجموعة(هذا.القطعة_السابقة.الكسور+1, هذا.القطعة_السابقة.الصادف-2)
   &&هذا.القطعة_السابقة.الكسور+1<=9&&هذا.القطعة_السابقة.الصادف-2>=1
   &&!هذا.في_المجموعة(هذا.القطعة_السابقة.الكسور, هذا.القطعة_السابقة.الصادف-1)){
    هذا. رسم_دائرة_المرشح(هذا.القطعة_السابقة.الكسور+1, هذا.القطعة_السابقة.الصادف-2);
   }
   إذا(!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x+2, هذا. المسبق_الشطرنجي. y-1)
   &&هذا. المسبق_الشطرنجي. x+2<=9&&هذا. المسبق_الشطرنجي. y-1>=1
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x+1, هذا. المسبق_الشطرنجي. y)){
    هذا. رسم_دائرة_المرشح(هذا. المسبق_الشطرنجي. x+2, هذا. المسبق_الشطرنجي. y-1);
   }
   إذا(!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x+2, هذا. المسبق_الشطرنجي. y+1)
   &&هذا. المسبق_الشطرنجي. x+2<=9&&هذا. المسبق_الشطرنجي. y+1<=10
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x+1, هذا. المسبق_الشطرنجي. y)){
    هذا. رسم_دائرة_المرشح(هذا. المسبق_الشطرنجي. x+2, هذا. المسبق_الشطرنجي. y+1);
   }
   إذا(!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x+1, هذا. المسبق_الشطرنجي. y+2)
   &&هذا. المسبق_الشطرنجي. x+1<=9&&هذا. المسبق_الشطرنجي. y+2<=10
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x, هذا. المسبق_الشطرنجي. y+1)){
    هذا. رسم_دائرة_المرشح(هذا. المسبق_الشطرنجي. x+1, هذا. المسبق_الشطرنجي. y+2);
   }
   إذا(!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x-1, هذا. المسبق_الشطرنجي. y+2)
   &&هذا. المسبق_الشطرنجي. x-1>=1&&هذا. المسبق_الشطرنجي. y+2<=10
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x, هذا. المسبق_الشطرنجي. y+1)){
    هذا. رسم_دائرة_المرشح(هذا. المسبق_الشطرنجي. x-1, هذا. المسبق_الشطرنجي. y+2);
   }
   إذا(!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x-2, هذا. المسبق_الشطرنجي. y+1)
   &&هذا. المسبق_الشطرنجي. x-2>=1&&هذا. المسبق_الشطرنجي. y+1<=10
   &&!هذا. في_المجموعة(هذا. المسبق_الشطرنجي. x-1, هذا. المسبق_الشطرنجي. y)){
    هذا. رسم_دائرة_المرشح(هذا. المسبق_الشطرنجي. x-2, هذا. المسبق_الشطرنجي. y+1);
   }
   break;
   case "相":
   إذا (this.preChess.y==10){}
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
   }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
   } آخرا إذا (this.preChess.x==1){
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
   } آخرا إذا (this.preChess.x==9){
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
   }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
   }
   break;
   case "象":
   إذا (this.preChess.y==1){
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
   } آخرا إذا (this.preChess.y==5){
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
   } آخرا إذا (this.preChess.x==1){
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
   } آخرا إذا (this.preChess.x==9){
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
   }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x+2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+2,this.preChess.y+2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y-2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y-2);
    }
    إذا (!this.inArray(this.preChess.x-2,this.preChess.y+2))
    &&!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-2,this.preChess.y+2);
    }
   }
   break;
   case "仕":
   if(this.preChess.x==5&&this.preChess.y==9){
    إذا (!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-1,this.preChess.y-1);
    }
    if(!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-1,this.preChess.y+1);
    }
    if(!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+1,this.preChess.y-1);
    }
    if(!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+1,this.preChess.y+1);
    }
   }
    this.drawCandidateCircle(5,9);
   }
   break;
   case "士":
   if(this.preChess.x==5&&this.preChess.y==2){
    إذا (!this.inArray(this.preChess.x-1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x-1,this.preChess.y-1);
    }
    if(!this.inArray(this.preChess.x-1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x-1,this.preChess.y+1);
    }
    if(!this.inArray(this.preChess.x+1,this.preChess.y-1)){
    this.drawCandidateCircle(this.preChess.x+1,this.preChess.y-1);
    }
    if(!this.inArray(this.preChess.x+1,this.preChess.y+1)){
    this.drawCandidateCircle(this.preChess.x+1,this.preChess.y+1);
    }
   }
    this.drawCandidateCircle(5,2);
   }
   break;
   case "帅":
   if(!this.inArray(this.preChess.x,this.preChess.y-1)&&this.preChess.y>8){
    this.drawCandidateCircle(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.drawCandidateCircle(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;
   حالة "جندي":
   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>1){
    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;
   حالة "جندي":
   if(this.preChess.y<=5&&!this.inArray(this.preChess.x,this.preChess.y+1)){
    this.drawCandidateCircle(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>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;
   حالة "مدفع":
   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;
  }
  }
  // 画候选形状
  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);
   حالة "جندي":
   العودة إلى this.rule_Soldier_r(i, j);
   حالة "جندي":
   العودة إلى this.rule_Soldier_b(i, j);
   حالة "مدفع":
   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);
   حالة "جندي":
   العودة إلى this.rule_Soldier_r(i, j);
   حالة "جندي":
   العودة إلى this.rule_Soldier_b(i, j);
   حالة "مدفع":
   إذا (this.rule_Cannon(i, j) == 1) {
    return true;
   }
   return false;
  }
  }
  // قواعد السيارة
  obj.rule_Car = function(i, j) {
  if(this.preChess.x ==i||this.preChess.y==j){
   if(this.preChess.x ==i){
   إذا (this.preChess.y < j) {
//    console.log("أسفل");
    var hasObstacle = false;
    للحصول على var p = this.preChess.y + 1؛ إذا كان p < j؛ زيادة p؛}
    إذا (this.inArray(i, p)) {
     hasObstacle = true;
     break;
    }
    }
    if(hasObstacle){
    return false;
    }
   }
   إذا (this.preChess.y > j) {
//    console.log("أعلى");
    var hasObstacle = false;
    للحصول على var p = this.preChess.y - 1؛ إذا كان p > j؛ نقص p؛}
    إذا (this.inArray(i, p)) {
     hasObstacle = true;
     break;
    }
    }
    if(hasObstacle){
    return false;
    }
   }
   }
   إذا (this.preChess.y == j) {
   إذا (this.preChess.x < i) {
//    console.log("يمين");
    var hasObstacle = false;
    للحصول على var p = this.preChess.x + 1؛ إذا كان p < i؛ زيادة p؛}
    إذا (this.inArray(p, j)) {
     hasObstacle = true;
     break;
    }
    }
    if(hasObstacle){
    return false;
    }
   }
   إذا (this.preChess.x > i) {
//    console.log("يسار");
    var hasObstacle = false;
    للحصول على var p = this.preChess.x - 1؛ إذا كان p > i؛ نقص p؛}
    إذا (this.inArray(p, j)) {
     hasObstacle = true;
     break;
    }
    }
    if(hasObstacle){
    return false;
    }
   }
   }
   return true;
  }
  return false;
  }
  // قواعد الحصان
  obj.rule_Horse = function(i, j) {
  var hasObstacle = false;
  var that = this;
  إذا ((Math.abs(this.preChess.x - i) == 1 && Math.abs(this.preChess.y - j) == 2)
  || (Math.abs(this.preChess.x - i) == 2 && Math.abs(this.preChess.y - j) == 1)) {
   إذا (this.preChess.x - i == 2) { // يسار
   $.each(that.cheer_arr_ALL,function(ii,ee){
    إذا (ee.x == that.preChess.x - 1 && ee.y == that.preChess.y) {
    hasObstacle =true;
    return false;
    }
   });
   if(hasObstacle){
    return false;
   }
   ELSE IF (i - that.preChess.x == 2) { // يمين
   $.each(that.cheer_arr_ALL,function(ii,ee){
    إذا (ee.x == that.preChess.x + 1 && ee.y == that.preChess.y) {
    hasObstacle =true;
    return false;
    }
   });
   if(hasObstacle){
    return false;
   }
   if(ee.x ==that.preChess.x&&ee.y==that.preChess.y-1){
   $.each(that.cheer_arr_ALL,function(ii,ee){
    else if(j-that.preChess.y==2){ // 下
    hasObstacle =true;
    return false;
    }
   });
   if(hasObstacle){
    return false;
   }
   }
   $.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){
    }
    $.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, // حجم الصندوق
//  radius:23, // قطر قطعة الشطرنج
//  ccr:3   // قطر الصغيرة المرشحة
//  });
 </script>
 </body>
</html>

هذا هو نهاية محتوى هذا المقال، نأمل أن يكون محتوى هذا المقال قد ساعدكم في التعلم أو العمل، ونأمل أيضًا أن تدعموا دليل التدريب!

بيان: محتوى هذا المقال تم جمعه من الإنترنت، حقوق الطبع والتأليف تخص المالك، تم جمع المحتوى من قبل المستخدمين على الإنترنت بطرق متعمدة وتم تحميله بشكل مستقل، هذا الموقع لا يملك حقوق الملكية، لم يتم تعديل المحتوى بشكل يدوي، ولا يتحمل أي مسؤولية قانونية متعلقة بذلك. إذا اكتشفت محتوى يشتبه في أنه ينتهك حقوق الطبع والتأليف، فيرجى إرسال بريد إلكتروني إلى: notice#oldtoolbag.com (الرجاء استبدال # بـ @ عند إرسال البريد الإلكتروني) لتقديم الشكوى، وقدم الأدلة ذات الصلة، وسيتم حذف المحتوى المزعوم فور التحقق منه.

من المحتمل أن تعجبك