javascript – 等距引擎绘图问题

我正在尝试用js(canvas)编写游戏引擎.到现在为止还挺好.
但我有一个问题,我的世界是菱形的,我从上到下渲染瓷砖.

问题是当我的瓷砖大于1个瓷砖(例如2×2)时会发生这种情况：

房子在瓷砖(2,1)上定义.
左边的岩石放在(1,0)

首先渲染图块(1,0),然后下一个图块是(2,1),因为它位于同一行和右侧.

你怎么解决这个问题？

最佳答案

你应该能够通过将图形分解成更小的部分来避免这个问题 – 网格上每个图块一个.想到它的好方法是这样的：如果你可以从正上方查看网格,每个精灵不应该溢出它们分配给它的单元格的边缘.

例如,下面的这个单元格可能只包含较小立方体所示的房屋的前部：

在某些时候,您可能还需要在同一个单元格中对多个精灵进行微观管理,但在较小的空间中这是相同的概念.