HTML and CSS Reference

In-Depth Information

When the tank is not moving, we know that we must be at the center of the current node. This

requires us to calculate how and where to move the tank to the next node and what angle it

should be rotated in.

iif
(
!
finishedPath
) {

iif
(
nextNode
.
x
>
currentNode
.
x
) {

colDelta
=
1
;

}
else

else iif
(
nextNode
.
x
<
currentNode
.
x
) {

colDelta
=-
1

}
else

else
{

colDelta
=
0

}

iif
(
nextNode
.
y
>
currentNode
.
y
) {

rowDelta
=
1
;

}
else

else iif
(
nextNode
.
y
<
currentNode
.
y
) {

rowDelta
=-
1

}
else

else
{

rowDelta
=
0

}

angleInRadians
=
Math
.
atan2
(
colDelta
,
rowDelta
);

tankMoving
=
true

true
;

}

If the
x
value of
nextNode
is greater than the
x
value of
currentNode
, the tank will need to

move to the right. If the opposite is true, the tank will move to the left. If the
x
values are

equal, there will be no movement on the x-axis.

If the
y
value of
nextNode
is greater than the
y
value of
currentNode
, the tank will need to

move down. If the opposite is true, the tank will move up. If the
y
values are equal, there will

be no movement on the y-axis.

After we have calculated the
rowDelta
and
colDelta
values, we can use those to find the

angle to rotate the tank. This is accomplished by passing them into the
Mathy.atan2
func-

tion. Notice that we swap the normal
y
,
x
(row, col) in the
atan2
function with
x
,
y
(col,row)

to match the screen coordinates for our tile map rather than the
astar.search()
returned co-

ordinates.Thisgoesbacktothetilemapbeinglaidoutinrowsofcolumnsratherthancolumns

of rows (the way the
graph.as
uses them).

Finally, if the tank has not finished its path, we need to add the
colDelta
value to
the
tankX

position and the
rowDelta
value to the
tankY
position:

tankX
+=
colDelta
;

tankY
+=
rowDelta
;