js广度优先搜索算法

Html

Css

 canvas {
	margin-top:100px;
	margin-left:calc(50% - 300px);
	/* border:1px solid rgb(65,114,163);
	*/
}

var canvas = document.getElementById('canvasCtx')
    var btn = document.getElementById('btn')
    var digLett = [] // 地鼠集合，
    var digPass = [] // 地鼠打过的洞，每个节点只能被一只地鼠经过
    var result = null

class drawCtx{
        constructor (avgCalc) { // 构造函数
            this.ctx = canvas.getContext('2d')
            this.width = canvas.width
            this.height = canvas.height
            this.avgCalc = avgCalc
        }
        mapStart () {  // 绘制地图
            this.ctx.beginPath()
            for(var i = 0; i< this.width / this.avgCalc + 1; i++){
                this.ctx.moveTo(0, i * this.avgCalc)
                this.ctx.lineTo(this.width, i * this.avgCalc)

this.ctx.moveTo(i * this.avgCalc, 0)    
                this.ctx.lineTo(i * this.avgCalc, this.height)
            }
            this.ctx.stroke()
        }
        eraset (x, y, w) { // 对指定的坐标范围进行擦除
            this.ctx.clearRect(x, y, w, w)
        }
    }

class digLettNode{ // 地鼠节点
        constructor (x, y, parent) {
            this.x = x
            this.y = y
            this.parent = parent
        }
    }

class breadthEntity extends drawCtx{ // 广度优先搜索 继承父类    
        constructor (avgCalc) {
            super(avgCalc)
            digLett.push(new digLettNode(0, 0, null)) // 默认从0，0开始
            this.maxX = this.width / this.avgCalc // 最大的X坐标
            this.maxY = this.height / this.avgCalc // 最大的Y坐标
        }
        drawColor (x, y, color) { //  对某一节点进行绘制
            this.ctx.beginPath()
            this.ctx.fillStyle = color ?? 'orange'
            this.ctx.fillRect(x * this.avgCalc, y * this.avgCalc, this.avgCalc, this.avgCalc)
        }
        *calcMap () { // 模拟深度优先搜索
            digPass.push(digLett[0]) // 将当前的信息存入已经过的集合

while(digLett.length){
                var theDig =  digLett.shift() // 从集合上面取出一个，模拟队列
                // this.eraset(theDig.x + 1, theDig.y + 3, this.avgCalc - 2)
                // this.drawColor(theDig.x, theDig.y)
                this.buttress(theDig.parent, theDig)
                yield

}
        }
        ifNext (ii) { // 是否已经走过
            for(var item of digPass){
                if(item.x == ii.x && item.y == ii.y) return true
            }
            return false
        }
    }

var drawCtxMap = new breadthEntity(20)
    drawCtxMap.mapStart()
    var yieldList = drawCtxMap.calcMap()
    setInterval(() => {
        yieldList.next()
    }, 0);

↑上面代码改变，会自动显示代码结果 jQuery调用版本：2.1.4

立即下载

js广度优先搜索算法



代码描述：随机生成迷宫，免费学习算法

更新时间：2020-10-12 23:58:51
代码贴着注释，随机生成迷宫
1. 在上一条智能贪吃蛇的基础上面拓展了随机生成迷宫
2. 里面有用到javascript的迭代器，学习入门算法的必备之作
3. 免费下载，无需jq币即可学习
4. javascript迭代器是js前端工程师月薪过万的必备技能

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

010

相关代码

js广度优先搜索算法

最新