Home > Web Front-end > H5 Tutorial > body text

HTML5+A* algorithm to implement code sharing for game pathfinding

黄舟
Release: 2017-03-24 15:45:30
Original
2494 people have browsed it

Function description:

Combining A* algorithm and HTML5 A completed pathfinding demo.

Click anywhere on the map, and the bird will find the shortest distance to that location.

Effect preview:

HTML5+A* algorithm to implement code sharing for game pathfinding

Code analysis:

Let’s talk about the implementation of the “crossing corner rule” mentioned in it:

The so-called "Crossing the Corner Rule" is the situation as shown in the picture below: Assume that green is an obstacle. When the red square on the right wants to reach the yellow square above, it is not allowed to directly pass through the red square. Jump to the yellow square and need to pass through the blue square:

My implementation method is to judge and use the x value of the current grid and the y value of the next grid. The grid or the grid using the current grid y value and the next grid x value is an obstacle, then the grid is ignored during this path finding process.

Code:

if (isWall(pointsArr[i][point.x], this.wallValueArr) || isWall(pointsArr[point.y][j], this.wallValueArr)) {                             
 //拐角规则,如果检测某点四周的点时,该点和四周上某点之间隔着一个障碍物,则忽略该点,暂不添加到开始列表
                continue;
                        }
Copy after login
.

The above is the detailed content of HTML5+A* algorithm to implement code sharing for game pathfinding. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template