私の初めてのh 5五子棋ゲーム作品

2891 ワード

この长い夏休みに、私は実习を始めて、指导の先生の指导の下で、私达はhtml 5を学んで五子棋をして、私のこの初心者にとって、课程は难しいですが、しかし私达の资料を调べてまじめに授业を闻いて、やはり问题を次から次へと解决しました.
五子棋のアルゴリズムはとても深くて、碁盤の設計はとてもやりにくいです.下に私のコードを貼って、まだゲームができませんが、今はもう碁を打つことができて、ゲームのルールを作るだけです.


	
		
		     
	
	
		
		
        
        	//  canvas   
        	var ChessCanvas = document.getElementById("myCanvas");
        	//    
        	var gameCanvas = ChessCanvas.getContext("2d");
        	//      
        	var map = 25;
        	//    
        	var chessSize = 23;
        	//     
        	var x = y = 0;
        	//     
        	var isRed = true;//==true     ,     
        	var color = "#FF0000";
        	
        	//         
        	//       0:   1:    2:   
        	var chessData = new Array(23);
        	for(var i=0;i<23;i++)
        	{
        		chessData[i] = new Array(23);
        		for(var j=0;j<23;j++)
        		{
        			chessData[i][j] = 0;
        		}
        	}
        	//       
        	
        	var i,j;
        	//    
        	for(var i=0;i<23;i++)
        	{
        		//   
        		gameCanvas.moveTo(10,i*map+10);
        		gameCanvas.lineTo(560,i*map+10);
        		gameCanvas.moveTo(10+i*map,10);
        		gameCanvas.lineTo(10+i*map,560);
        		gameCanvas.stroke();// 
        	}
        	//    ,    
        	function addChess(x,y)
        	{
        		//              π/180*         180/π*  
        		gameCanvas.beginPath();
        		gameCanvas.arc(x,y,chessSize/2,0*Math.PI,2*Math.PI,true);
        		gameCanvas.fillStyle = color;
        		gameCanvas.fill();
        		gameCanvas.closePath();//  
        		
        		if(color == "#000000")
        		{
        			color = "#FF0000";
        			//  
        			chessData[i][j] = 2;
        			
        		}else{
        			color = "#000000";
        			//  
        			chessData[i][j] = 1;
        			
        		}
        	}
        	//                     。。。
        	//window.setInterval(  ,  );
        	
        	//      
        	//function isFameWin()
        	
        	//        ,      AI                       
        	//function gameAI()
        	
        	//          
        	document.onmousedown = function(e)
        	{
        		window.onclick = function(){
        			
        			//       
        			i = Math.round((e.x-10)/25);
        			j = Math.round((e.y-10)/25);
        			
        			x = i*25+10;//math     
        			y = j*25+10;
			  
					//         
					if(chessData[i][j]==0)
					{
						//  
						addChess(x,y);
					}else{
						alert("    !    ,           ");
					}
        			
        			}
        	}