Astar 学习

Astar寻路教程

http://www.cnblogs.com/thunder123/archive/2010/08/18/1802199.html

学习代码[持续添加] :

<style type="text/css">
    #area{border: dashed 1px #999; overflow: hidden; position: relative;}
    .item{border-right: dashed 1px #999;border-bottom: dashed 1px #999; position: absolute;}


</style>
<div id="area">

</div>
<script type="text/javascript">
    var Map={
        width : 940,
        height : 600,
        map : {},//map10 : {xc:0, yc:0, len:0, map:[]}

        makeDB : function(length){//按length为边长建立索引数据表
            var xc = parseInt((this.width - 1) / length) + 1;
            var yc = parseInt((this.height - 1) / length) + 1;
            var map = [];
            for(var i=0;i<xc;i++){
                if(!map[i]) map[i]=[];
                for(var j=0;j<yc;j++){
                    map[i][j]=0;
                }
            }
            this.map['map'+length]={xc:map.length, yc:map[0].length, len:length, map:map};
        },
        drawDB : function(db){
            var html='';
            for(var i=0;i<db.xc;i++){
                for(var j=0;j<db.yc;j++){
                    html += '<div id="b-' + i + '-' + j + '" class="item" style="height:' + db.len + 'px;width:' + db.len + 'px;left:' + (db.len*i) + 'px;top:' + (db.len*j) + 'px"></div>';
                }
            }
            $('#area').html(html);
        },
        init : function(xc, yc){
            //set map size
            $('#area').css({width : this.width, height : this.height});

            //create db
            this.makeDB(10);
            this.makeDB(50);
            this.makeDB(100);

            //drawDB
            //this.drawDB(this.map.map10);
            //this.drawDB(this.map.map50);
            this.drawDB(this.map.map100);
        }
    }

    Map.init();


    var Astar = {

    }
</script>