在javascript画布中复制拼贴区域

Question

我有一个显示瓷砖地图的画布。当滚动而不是刷新整个图块列表时，我想选择我可以重复使用的图块图的有用部分并将其复制到另一个画布。

例如，如果图块地图是5个图块：

0 1 2 3 4
1 2 3 4 5
2 3 4 5 6
3 4 5 6 7
4 5 6 7 8

我想向右移动（x）1个瓷砖......我可以复制瓷砖1到4，因为这些将在下一帧中使用。所以我会复制：

1 2 3 4
2 3 4 5
3 4 5 6
4 5 6 7
5 6 7 8

我似乎遇到了为此提出正确数学的问题。

目前我有以下代码：

// Calculate from and to for x and y
// Change formula if positive or negative movement
    // movX / movY = amount to move across x or y
    // (i.e. movX = 1 (right) or movX = -1 (left)
    // tileXFrom / tileYFrom = tile to start copy from
    // tileXTo / tileYTo = tile to finish copying at
if(movX > 0)
{
    tileXFrom = origX + movX;
    tileXTo = tileXFrom + (tilesCountX - movX);
}
else
{
    tileXFrom = origX;
    tileXTo = tileXFrom + (tilesCountX + movX);
}

if(movY > 0)
{
    tileYFrom = origY + movY;
    tileYTo = tileYFrom + (tilesCountY - movY);
}
else
{
    tileYFrom = origY;
    tileYTo = tileYFrom + (tilesCountY + movY);
}

这些计算工作正常，但有更好的方法吗？我想知道是否有一种方法围绕正/负if语句。

我现在所处的部分是如何获得每个人的真实x，y位置。

所以我需要将tile 1,0转换为屏幕x，y位置，以便从那里开始复制。

如果这一切都有意义吗？！

干杯

Answer 1

您可以使用三元运算符来缩短代码，但这不会改变功能：

tileXFrom = (movX > 0) ? origX + movX : origX;
tileXTo   = (movX > 0) ? tileXFrom + (tilesCountX - movX) : tileXFrom + (tilesCountX + movX);
tileYFrom = (movY > 0) ? origY + movY : origY;
tileYTo   = (movY > 0) ? tileYFrom + (tilesCountY - movY) : tileYFrom + (tilesCountY + movY);