Question

我的剧本有问题。我所拥有的是使用二维数组制作的平铺地图，该数组指定具有不同数字的不同平铺类型，并在容器div元素中绘制。我还有一个可移动的字符div元素。我的问题是我无法弄清楚如何检测瓷砖并利用所述检测的结果来确定角色是否可以移动到附近的瓷砖中。

我托管的相关网站如下：

http://brandynssite.webs.com/map_tile.html

正如您在该示例中所看到的，有一个绘制平铺地图的容器，一个从0,0开始的字符元素，并且有两个按钮可以检查字符位置和平铺类型。我想要发生的是代码在按键事件发生后检测角色正在前往的磁贴并尽可能移动它们。我需要哪些功能，并且是我需要的一组特定算法，这些算法对于我在该站点上所拥有的内容一样简单？

我提供了一个允许角色移动的功能，因为它似乎是我能想到的可能碰撞检测方面最相关的功能。

function anim(e) {

if(e.keyCode==39){
        character_left += 10;
        x += 1;
        playerPos=mapArray[y][x];


        character.style.left = character_left + "px";
        if(character_left >= 190){ 
            character_left -= 10;
            x -= 1;
            playerPos=mapArray[y][x];

            }
        }
if(e.keyCode==37){
        character_left -= 10;
        x -= 1;
        playerPos=mapArray[y][x];
        character.style.left = character_left + "px";
        if(character_left <= 0){
            character_left += 10;
            x += 1;
            playerPos=mapArray[y][x];
            }   

        }
if(e.keyCode==40){
        character_top += 10;
        y += 1;
        playerPos=mapArray[y][x];

        character.style.top = character_top + "px";
        if(character_top >= 190){
            character_top -= 10;
            y -= 1;
            playerPos=mapArray[y][x];
            }
        }
if(e.keyCode==38){
        character_top -= 10;
        y -= 1;
        playerPos=mapArray[y][x];

        character.style.top = character_top + "px";
        if(character_top <= 0){
            character_top += 10;
            y += 1;
            playerPos=mapArray[y][x];

            }
        }
}

Answer 1

您需要创建数组，指定玩家可以移动的图块。所以：

var iCanMoveOn = [0, 2, 5];

而且你需要检查旁边的瓷砖是否可以继续。

if(iCanMoveOn.indexOf(mapArray[y][x+1]) > -1){
    //move player
}

x和y是坐标，其中数组是您正在添加的图块。要检查您是否可以进入磁贴，您需要从其中一个坐标添加或取消“1”。所以：

[x+1]位于右侧。同样：左侧的图块为[x-1]，图块位于顶部：[y-1]，底部图块为：[y+1]

要检查数字是否在数组中，我使用了this

二维阵列构建瓦片图中的碰撞检测情况。

1 个答案: