Javascript-基于颜色的在线碰撞检测

我的游戏是colegame.herokuapp.com，我想知道我是否能做到这一点，这样就不可能离开画布，因为如果任何人离开画布，你都看不到他们。对于我的玩家来说，我使用表情符号是为了更容易编码和减少时间。有人知道如何根据颜色进行碰撞检测吗？谢谢，请提供用于它的代码，因为我是初学者。画布的大小取决于屏幕的大小。但它始终是正方形。

您需要根据画布的大小限制播放器的位置

这里有一个100x100世界的例子，有一个10x10播放器

单击黑框，然后使用键盘上的箭头键移动“播放器”

var canvas=document.getElementById（“我的画布”）；
var ctx=canvas.getContext（“2d”）；
var playerPosition=[45,45]；
if（canvas.getContext）{
draw（）；
window.addEventListener（'keydown'，move，true）；
}
功能移动（evt）
{
开关（evt.keyCode）{
案例37://左
播放位置[0]-=5；
打破
案例38://以上
播放位置[1]-=5；
打破
案例39://对
播放位置[0]+=5；
打破
案例40://向下
播放位置[1]+=5；
打破
}
//限制玩家的移动发生在这里
如果（播放位置[0]<0）播放位置[0]=0；
如果（播放位置[0]>90）播放位置[0]=90；
如果（播放位置[1]<0）播放位置[1]=0；
如果（播放位置[1]>90）播放位置[1]=90；
draw（）；
}
函数绘图（）{
ctx.fillStyle=“#000000”；
ctx.fillRect（0,0,100,100）；
ctx.fillStyle=“#ff0000”；
ctx.fillRect（playerPosition[0]，playerPosition[1]，10，10）；
}

#我的画布{
宽度：100px；
高度：100px；
}

---

您可能希望提供至少尝试过的代码。Stackoverflow不是“做我的家庭作业”网站。我们在这里提供指导和帮助，但不是提供问题的完整解决方案。仅供参考

KeyboardEvent.keyCode

是折旧财产，您应该改用

KeyboardEvent.code

。有关更多信息，请参阅MDN