Javascript 用较小的矩形列表完美地填充矩形

我想取一个边界矩形和一列可能相互重叠或边界重叠的其他矩形（x、y、宽度、高度），然后移动/调整它们的大小，使其完全适合边界内部，不留任何空间或重叠

我搜索过Google、Stack Exchange和其他资源，但找不到该算法的名称，更不用说实现了。是否有标准的实施方法

以下是我希望算法能做的：

其他想法：

我使用的是Javascript，但它是任何语言的参考实现 会有帮助的

如果发生重叠，任何调整矩形大小的方法都可以 但我可能会选择重叠的中点

最终矩形可以是任意大小，包括一维中的0，长度为 因为他们都在规定的范围内

我的数据具有标准化为0-1范围的边界和矩形， 其中0,0是边界的左上角，1,1是底部 右角

---

与您的问题相关的一个著名问题是“托盘装载”问题。一般来说，这个问题的复杂程度是未知的，是一个开放的问题。您可以在中阅读有关该问题及其变化的更多信息。

这似乎是查找给定矩形布局结构的问题

矩形的总体布局可以是任何类型，就像在his中一样，这可能很难解决。我将通过定义简单的布局模型来解决这个问题，该模型可用于将输入数据转换为输入数据，然后使用该布局数据填充输入边界矩形

最简单的布局是通过水平或垂直堆叠将一个盒子分成两个盒子。在您的示例中，边界矩形被划分为两个水平堆叠的长方体。右侧的一个被划分为垂直堆叠的盒子，顶部的一个被水平划分

为给定的矩形集创建布局的主要步骤是找到划分最佳矩形集的水平线或垂直线。之后，同样的方法应用于两组通过拆分生成的矩形

创建布局结构后，通过从下到上递归合并框来计算相对大小，很容易找到矩形的大小和位置。而不是通过从上到下传播位置和大小

---

此布局的改进是允许水平或垂直堆叠更多箱子的布局。结果是一样的，但这种方法可能更快，因为需要更少的分裂线查找迭代。

感谢您的资源！我的问题是不同的，我希望更简单，因为内部框可以调整大小，使其适合。我认为它可能更类似于松弛算法。为了澄清第4点：图像的数据应该是

[[0,0]，[0,1]，[0,2]，[1,0]]

，或者最后一个是

[1,1]

，因为它是第二行和第二列？没有定义大小，因为您可以调整块的大小，对吗？但是，如果第4点的大小与此有关，那么第一个值应该是

[0,0]到[1,0.5]

？这意味着您可以根据最接近的尺寸重新订购所有商品？抱歉，不够清晰！我的意思是，边界的左上角将表示为

{x:0.0，y:0.0}

，右下角将表示为

{x:1.0，y:1.0}

。所包含的每个矩形都是相对于边界的大小来表示的，例如，填充右上四分之一的矩形将是

{x:0.5，y:0.0，宽度：0.5，高度：0.5}

。未排序示例图像中最大的蓝色矩形可能表示为

{x:-0.1，y:-0.1，w:0.5，h:1.0}

，这意味着脚本应该尽可能重新排列内部矩形，以适合其所需大小？因为你说你可以调整它的大小，指示三角形大小的数据只是一个建议，对吗？是的，这是正确的。输入数据是布局的建议，但只要形状保持矩形，边可以自由移动。因此，您只能移动边而不能移动顺序？