a star算法+list,减少遍历的开销

来源:互联网 发布:孤岛惊魂4优化太垃圾 编辑:程序博客网 时间:2024/06/06 03:28

问题


上一节,已经把a-star基本思想实践了一下,但是有个问题,就是慢

这一篇,使用list存储openlist

原因

看上次的代码
function loop(){if(findit==true){return ;}var fvalue=openlist[0].f;var currenttile=null;var openlistkey=0;for(var key in openlist){var tile=openlist[key];if(fvalue>=tile.f){fvalue=tile.f;currenttile=tile;openlistkey=key;}}closetile(currenttile);openlist.splice(openlistkey,1);checkNeighbourTile(currenttile);}

从openlist里面找到一个F值最小的tile,上次用的是数组,插入的时候也是随便插入的,所以,里面是乱序的,先找到最小的,必须遍历整个openlist,每一次loop都遍历,如果地图很大,开销也会很大, 所以优化点可以用list代替数组,然后插入的时候按照大小插入,这样整个list是按照F值从小到大的
每次loop就可以只要第一个节点,这样可以节省很多不必要的循环开销

代码

1.优化使用链表存储openlist
2.在tile身上存储是不是open,或者是不是close
3.修复一些bug
<html><head><style>.tile{float:left;width:50px;height:50px;display:block;border:3px solid black;}.tileclose{float:left;width:50px;height:50px;display:block;border:3px solid blue;}.tileopen{float:left;width:50px;height:50px;display:block;border:3px solid green;}.tilepath{float:left;width:50px;height:50px;display:block;background-color:black;}.f{color:#E1E100;font-weight:bold;font-size:16px;line-height:25px;display:inline-block;width:50px;height:25px;}.g{font-weight:bold;font-size:10px;line-height:25px;text-align:left;display:inline-block;width:25px;height:25px;}.h{font-weight:bold;line-height:25px;font-size:8px;text-align:right;display:inline-block;width:15px;color:red;height:25px;}</style><script>function keydown() {if((event.keyCode==65 ||event.keyCode==13)) {loop();}}function  click(e){if(e.target.className=='tile'){var a=e.target.id;var arr=a.split('_');var x=arr[1];var y=arr[2];setblock(x,y);}if(e.target.nodeName=="SPAN"){var a=e.target.parentNode.id;var arr=a.split('_');var x=arr[1];var y=arr[2];setblock(x,y);}}document.onmousedown=click;</script></head><body onkeydown="keydown();"><div class="controll"><input type="button" onclick="loop();" value="go" /></div><div id="tile_0_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_15" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_14" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_13" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_12" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_11" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_10" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_9" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_8" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_7" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_6" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_5" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_4" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_3" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_2" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_1" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div><div id="tile_0_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_1_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_2_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_3_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_4_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_5_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_6_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_7_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_8_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_9_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_10_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_11_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_12_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_13_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_14_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_15_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_16_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_17_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_18_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div id="tile_19_0" class="tile"><span id="fvalue" class="f"></span><span id="gvalue" class="g"></span><span id="hvalue" class="h"></span></div><div style="clear:both"></div></body><script type="text/javascript">var Node = function(newData){        this.next = null;        this.data = newData;    }    var List = function(){this.head = null;this.size = 0;this.insert = function(newData){newData.isInOpenList = true;this.size += 1;var newNode = new Node(newData);if(this.head == null){this.head = newNode;return;}var tempNode = this.head;if(tempNode.data.f > newData.f){newNode.next = this.head;this.head = newNode;}else{while(tempNode.next != null){if (tempNode.next.data.f > newData.f) {//找到了可插入点newNode.next = tempNode.next;tempNode.next = newNode;return;};tempNode = tempNode.next;}tempNode.next = newNode;}};this.getData = function(pos){if(pos >= this.size || pos < 0)return null;  else{tempNode = this.head;for(i = 0;i < pos;i++)  tempNode = tempNode.next;  return tempNode.data;   }};//remove the element at posthis.remove = function(data){data.isInOpenList = false;var tempNode = this.head;if(tempNode.data.x == data.x && tempNode.data.y == data.y){this.head = tempNode.next;}else{while(tempNode.next != null){if (tempNode.next.data.x == data.x && tempNode.next.data.y == data.y) {tempNode.next = tempNode.next.next;};}}}};</script><script>var maxY=14;var maxX=19;var tilelist=new Array();for(var i=0;i<=maxX;i++){tilelist[i] = new Array();for (var j=0; j<= maxY; j++){tilelist[i][j] = new tile();}}function setblock(x,y){tilelist[x][y]=1;var toblock=document.getElementById("tile_"+x+"_"+y);toblock.style.backgroundColor="blue";}function setStart(x,y){start = tilelist[x][y];start.x=x;start.y=y;start.parent=null;opentile(start);var toblock=document.getElementById("tile_"+x+"_"+y);toblock.style.backgroundColor="green";}function setDestination(x,y){destination = tilelist[x][y];destination.x=x;destination.y=y;var toblock=document.getElementById("tile_"+x+"_"+y);toblock.style.backgroundColor="red";}function isblock(x,y){if(tilelist[x][y]!=undefined && tilelist[x][y]!=null &&tilelist[x][y]==1){return true;}return false;}function closetile(tile){closelist.push(tile);tile.isInCloseList = true;updateValue(tile,"#9F4D95");}var findit=false;function opentile(tile){if(tile.x==destination.x && tile.y==destination.y){tile.style="tilepath";while(tile.parent){var tpath=document.getElementById("tile_"+tile.parent.x+"_"+tile.parent.y);tpath.style.backgroundColor="red";tile=tile.parent;}alert('find it');findit=true;}openlist.insert(tile);updateValue(tile,"#00EC00");}function updateValue(tile,color){var toblock=document.getElementById("tile_"+tile.x+"_"+tile.y);toblock.style.borderColor=color;var fspan=toblock.children[0];fspan.innerText=tile.f;var gspan=toblock.children[1];gspan.innerText=tile.g;var hspan=toblock.children[2];hspan.innerText=tile.h;}function tile(){this.x=0;this.y=0;this.g=0;this.h=0;this.f=0;this.isInOpenList = false;this.isInCloseList = false;this.parent=null;}var neighbour=[[-1,1],[0,1],[1,1],[-1,0],[1,0],[-1,-1],[0,-1],[1,-1]];function checkNeighbourTile(tilecurrent){for(var i=0;i<8;i++){var x=tilecurrent.x+neighbour[i][0];var y=tilecurrent.y+neighbour[i][1];var tilenew =tilelist[x][y];tilenew.x=x;tilenew.y=y;if(x<0 || y<0 || x>maxX || y>maxY){continue;}if( isblock(x,y) ){//if is block,continue;continue;}if( tilenew.isInCloseList ){continue;}if( tilenew.isInOpenList){var gbefore=tilenew.g;var gnow=0;if(Math.abs(neighbour[i][0])==Math.abs(neighbour[i][1])){gnow=tilecurrent.g+14;}else{gnow=tilecurrent.g+10;}if(gnow<gbefore){tilenew.parent=tilecurrent;tilenew.g=gnow;tilenew.f=tilenew.g+tilenew.h;updateValue(tilenew);}}else{tilenew.parent=tilecurrent;if(Math.abs(neighbour[i][0])==Math.abs(neighbour[i][1])){tilenew.g=tilecurrent.g+14;}else{tilenew.g=tilecurrent.g+10;}tilenew.h=50*(Math.abs(x-destination.x)+Math.abs(y-destination.y));tilenew.f=tilenew.g+tilenew.h;opentile(tilenew,"#00EC00");}}}var by = function(name){return function(o, p){if(parseInt(o[name])==parseInt(p[name])){return 0;}if(parseInt(o[name])>parseInt(p[name])){return -1;}else{return 1;}}}var openlist=new List();var closelist=[];var start=null;var destination=null;setDestination(13,6);setStart(1,6);function loop(){if(findit==true){return ;}currenttile = openlist.head.data;closetile(currenttile);openlist.remove(currenttile);checkNeighbourTile(currenttile);}</script></html>


0 0