布置重叠的矩形

Question

我正在尝试布局一堆重叠的矩形，它们的开头是这样的：

alt text http://img690.imageshack.us/img690/209/picture1bp.png

我想到的2-pass算法大致是：

// Pass 1 - Move all rectangles to the right until they do not overlap any other rectangles
rects = getRectsSortedOnTopLeft(); // topmost first, all rects same size
foreach(rect in rects)
{
   while(rect.collidingRects().size() != 0)
   {
       rect.x += RECT_SIZE;
   }
}

这（可能）以矩形布局结束，如下所示： alt text http://img685.imageshack.us/img685/9963/picture2bc.png

这在美学上并不令人愉悦，所以我想到了第二遍，这会将它们全部从最顶部重新开始向左移动：

// Pass 2
foreach(rect in rects)
{
    while(rect.x >= LEFT_MARGIN)
    {
        assert(rect.collidingRects().size() == 0);
        rect.x -= RECT_WIDTH;
        if(rect.collidingRects().size() != 0)
        {
           rect.x += RECT_WIDTH;
           break;
        }
    }
}

我认为这最终应该如下所示（在实践中看起来完全正确）：

alt text http://img511.imageshack.us/img511/7059/picture3za.png

但是，我对这种算法持谨慎态度，因为我不确定它是否在所有情况下都能正确布局，而且它可能真的很慢。你觉得这个算法行得通吗？你能就更好的算法提出一些建议吗？

Answer 1

我认为这个问题具有多项式复杂性。假设您的示例限制只有两个矩形在任何给定点重叠并不是问题的真正限制，您需要尝试将矩形向右碰撞的所有可能顺序，以产生最佳（最小宽度）结果。这是一种空间打包问题，除非您的数据集小到足以暴力破解，否则这些问题很难解决。

但是，可以对您的伪代码进行一点小改进，这将在许多情况下提高其性能。

考虑这个期望的最终结果：

A
A C
A C E
A C E
B C E
B D E
B D F
B D F
  D F
    F

（其中一个字符的所有四个都是一个矩形）

您的第一个通道会将除 A 之外的所有内容向右移动，形成一个楼梯。然后在第二遍中，您的代码将拒绝将 B 移动到左边距，因为第一次移动它的尝试将与 E 重叠。您需要做的是从左边距开始并检查您可以移动每个的最左边的位置矩形到通过 2。

伪代码：

// Pass 1 - Move all rectangles to the right until they do not overlap any other rectangles
rects = getRectsSortedOnTopLeft(); // topmost first, all rects same width
foreach(rect in rects)
    while(rect.collidingRects())
        rect.x += RECT_WIDTH;
// Pass 2 - Move all rectangles to the leftmost position in which they don't overlap any other rectangles
foreach(rect in rects)
    for(i=LEFT_MARGIN; i+=RECT_WIDTH; i<rect.x)
    {
        o = rect.x;
        rect.x = i;
        if(rect.collidingRects())
            rect.x = o;
    }

Answer 2

您可以使用基于物理的方法，其中块是向左下落的刚体：

不，这不会一直产生最好的结果，但是观看了您的截屏视频后，我认为在交互式程序中使用它会非常直观，并且可能合适:)