Javascript SVG обнаружение столкновений на основе цвета в изображении SVG - PullRequest
0 голосов
/ 08 июня 2019

Я делаю игру, в которой персонаж игрока перемещается по сетке, которая является изображением SVG. Я не могу найти, как определить, будут ли координаты, по которым персонаж будет двигаться, быть цветом, который не допускает движения.

Само движение работает просто отлично, и, как и ожидалось, я просто не могу понять, как проверить цвет или есть другой способ обнаружить столкновение на одном SVG-изображении.

Вот SVG в файле HTML:

<svg width="600" height="580">
<svg viewBox="0 0 100 100" id="ViewBox">
<image x="0" y="0" xlink:href="doodmap.svg"></image>
<image x="40" y="40" width="18" height="18" xlink:href="Mage.svg"id="PlayerSprite"/>     
</svg>
</svg>

Вот моя функция перемещения в файле javascript:

function downmove(){
if(playerstats.position.y < 580){
        playerstats.position.y += 20;
        viewboxy += 20;
        document.getElementById("PlayerSprite").setAttribute("y", playerstats.position.y);
        document.getElementById("ViewBox").setAttribute("viewBox", viewboxx + " " + viewboxy + " 100 100");
        PMove();
    }
}   

Я ожидаю, что смогу определить цвет следующего квадрата и двигаться только в том случае, если следующий квадрат не определенного цвета.

...