Prime算法生成迷宫
生活随笔
收集整理的這篇文章主要介紹了
Prime算法生成迷宫
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
prime迷宮生成
- 結果展示
- 算法解析
- 實現代碼
結果展示
算法解析
參考鏈接
Prime迷宮生成算法的原理:
(1)初始地圖所有位置均設為墻
(2)任意插入一個墻體進墻隊列
(3)判斷此時墻體是否可以設置為路(判斷依據在于上下左右四個位置是否只有一個位置是路)
(4)若設置為路,則將該位置周圍(上下左右)的所有墻插入隊列,接著執行(5);若無法設置為路,直接執行(5)
(5)從墻隊列中刪去當前位置所在節點
(6)若墻隊列不為空,則從隊列中隨機選取一面墻重新執行(3),直到墻隊列為空
實現代碼
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>迷宮</title><style>table {margin: 0 auto;border-collapse: collapse;border: 1px solid #ddd;}td {width: 18px;height: 18px;box-sizing: border-box;border:1px solid #eee}td.wall {background: #eee;border: 1px solid #eee;}.now {background: #ffbd2a;}.now.success {background: #05dd8c}.map{width:100%;padding:20px;}</style> </head> <body> <div class="map"></div> <br> <p style="text-align: center">控制臺輸入loadMap(10,10)初始化地圖</p> <script>let mapEl = document.querySelector('.map');loadMap(20, 20);//初始化/**@param w :橫寬*@param h :縱高*/function loadMap(w, h) {let i, j, k;//1) 隨機二維數組作為原始地圖,實際上迷宮的地圖要小一圈let mapData = [],//原始地圖數據wallQueue = [];//墻塊隊列for (i = 0; i < h; i++) {mapData[i] = [];for (j = 0; j < w; j++) {k = i + '-' + j;mapData[i][j] = {x: j, y: i,k: k};//除最外層均標記為墻mapData[i][j].val = (i == 0 || i == h - 1 || j == 0 || j == w - 1)?1:0;}}//2)指定需要挖掉的墻作為入口,這里均以左側墻上隨機隨機位置let exitBlock = mapData[h - 2][2 + ~~(Math.random() * (w - 4))];wallQueue.push(exitBlock);//3)開始挖路let lastRoad,//最后一塊挖出的路ri, wall;while (wallQueue.length > 0) {ri = ~~(Math.random() * wallQueue.length);//從墻隊列中隨機一個wall = wallQueue[ri];//隨機墻//檢測上下左右是否有路,true=>設置為路,移除;false=>移除let mark = 0,y = wall.y,//檢測墻的縱坐標x = wall.x,//檢測墻的橫坐標//周圍需要檢測的點 //[[-1,0],[0,1],[1,0],[-1,0]] 上下左右 [y,x]relArr = [[(y - 1), x], [y, (x + 1)], [(y + 1), x], [y, (x - 1)]],relIndex,relBlock;for (i = 0; (relIndex = relArr[i]) != null; i++) {relBlock = mapData[relIndex[0]][relIndex[1]];if (relBlock && relBlock.val == 1) {mark++}}wallQueue.splice(ri, 1);//移除當前塊if (mark == 1) {wall.val = 1;lastRoad = wall;//如果當前塊為路,將周圍塊加入隊列for (i = 0; (relIndex = relArr[i]) != null; i++) {relBlock = mapData[relIndex[0]][relIndex[1]];if (relBlock.val == 0) {wallQueue.push(relBlock);}}}}/**設置出口,prime算法只是在特定的地圖內挖出若干條線,但不會挖通地圖,因此可以有兩種模式:* 1)入口和出口,出口需要遍歷邊緣打通* 2)唯一的缺口作為出口,最后一個打通的塊作為出發點*///4) 打印let resultStr = '';for (i = 0; i < h; i++) {resultStr += '<tr>';for (j = 0; j < w; j++) {if (i > 0 && i < h - 1 && j > 0 && j < w - 1) {let b = mapData[i][j];resultStr += '<td class="' + (b.val == 1 ? (lastRoad.k == b.k ? 'now' : '') : 'wall') + '" loc="' + b.k + '"></td>';}}resultStr += '</tr>'}mapEl.innerHTML = '<table>' + resultStr + '</table>';//移動document.addEventListener('keyup', move);function move(e) {//w:87 a:65 s:83 d:68let direct = {w: [-1, 0],//上移d: [0, 1],//右移s: [1, 0],//下移a: [0, -1]//左移}[e.key];if (direct) {//獲取當前位置let moveFlag = 0,locNow = document.querySelector('.now').getAttribute('loc').split('-');locNow[0] = +locNow[0] + direct[0];locNow[1] = +locNow[1] + direct[1];if (locNow[0] == exitBlock.y && locNow[1] == exitBlock.x) {moveFlag = 1;document.removeEventListener('keyup', move);} else {if (locNow[0] > 1 && locNow[0] < h - 2 && locNow[1] > 1 && locNow[1] < w - 2) {moveFlag = 2;}}if (moveFlag) {//移動if (mapData[locNow[0]][locNow[1]].val == 1) {let target = document.querySelector('[loc = "' + locNow[0] + '-' + locNow[1] + '"]');document.querySelector('.now').classList.remove('now');target.classList.add('now');if (moveFlag == 1) {target.classList.add('now', 'success');}}}}}}</script></body> </html>總結
以上是生活随笔為你收集整理的Prime算法生成迷宫的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: python 降维lda算法的使用_sk
- 下一篇: 大整数减法c语言_3.2 C语言运算符和