canvas并查集画随机迷宫

之前学习不想交集合(并查集)的数据结构,看了很多大老用窗体画出随机迷宫,感觉挺震撼的,下心学习了一下。
这个过程想着不太复杂,就是做起来挺麻烦,需要自己一点点处理。大概步骤如下
1:定义好不想交集合的基本类和方法(search,union等)
2:数组初始化,每一个数组元素都是一个集合,值为-1
3:随机查找一个格子(一维数据要转换成二维,有点麻烦),在随机找一面墙(也就是找这个格子的上下左右),还要判断找的格子出没出界。
4:判断两个格子是否在一个集合。如果在,则重新找,如果不在,那么把墙挖去
5:把墙挖去有点繁琐,需要考虑奇偶判断它那种墙,然后擦掉。(根据数组转换成真实距离)
6:最终得到一个完整的迷宫。
js的代码如下:

<!DOCTYPE html>
<html>
  <head>
    <title>MyHtml.html</title>	
  </head> 
  <body>
  <canvas id="mycanvas" width="600px" height="600px"></canvas>
    
  </body>
  <script type="text/javascript">

   var aa=14;
    var chess = document.getElementById("mycanvas");
    var context = chess.getContext('2d');

    //  var context2 = chess.getContext('2d');
    //      context.strokeStyle = 'yellow';
    var tree = [];//存放是否联通
    var isling=[];//判断是否相连
    for(var i=0;i<aa;i  ){
        tree[i]=[];
        for(var j=0;j<aa;j  ){
            tree[i][j]=-1;//初始值为0
        }
    }  for(var i=0;i<aa*aa;i  ){
        isling[i]=[];
        for(var j=0;j<aa*aa;j  ){
            isling[i][j]=-1;//初始值为0
        }
    }
    
    function drawChessBoard(){//绘画
        for(var i=0;i<aa 1;i  ){
            context.strokeStyle='gray';//可选区域
            context.moveTo(15 i*30,15);//垂直方向画15根线,相距30px;
            context.lineTo(15 i*30,15 30*aa);
            context.stroke();
            context.moveTo(15,15 i*30);//水平方向画15根线,相距30px;棋盘为14*14;
            context.lineTo(15 30*aa,15 i*30);
            context.stroke();
        }
    }
    drawChessBoard();//绘制棋盘
   
    //      var mymap=new Array(36);
    //      for(var i=0;i<36;i  )
    //     {mymap[i]=-1;}

    

    function getnei(a)//获得邻居号  random
    {
        var x=parseInt(a/aa);//要精确成整数
        var y=a

你可能感兴趣的:(#,java,EE,#,并查集)