日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔！

生活随笔

當前位置： 首頁 >

canvas并查集画随机迷宫

發布時間：2025/3/20 31 豆豆
生活随笔 收集整理的這篇文章主要介紹了 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

總結

以上是生活随笔為你收集整理的canvas并查集画随机迷宫的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。