假设有一组 50 张不同宽度和高度的图像，如何以一种有趣的*抽象方式以编程方式排列它们？ （见下图）
对于我的具体情况，所有图像的最大尺寸设置为 150 像素，这可能意味着高度或宽度最大为 150 像素（可以是 150 像素 x 450 像素，或 378 像素 x 150 像素）。
这似乎是一个经典的编程挑战，但我发现 Google 很难找到这个主题...
编辑：更改图像以表明对整体布置方式没有限制（不必适合设定区域）
【问题讨论】：
标签： algorithm layout image-processing user-interface
如果你不反对jquery插件，可以看看这个——http://masonry.desandro.com/
【讨论】：
你的问题是NP-Hard。
This thread 表明，即使使用一种类型的 nXm 矩形，也很难找到是否有解决方案，因此您更广义的问题当然也是 NP-Hard [唯一一种类型的矩形是这个问题的一个私人案例]
如果您追求优化的解决方案，您可以尝试 backtracking 解决方案，或者尝试使用启发式方法，例如 genetic algorithms 或 hill climbing，这会更快 - 但通常会找到非最佳结果。
【讨论】：
"no large gaps" [正如 OP 要求的那样]，你需要找到给定的 50 张图像可以容纳的最小矩形。如果你能在多项式时间内找到它，如果你事先知道尺寸，你也可以在多项式时间内找到答案。
我已经构建了类似的东西（尽管它可能不是最复杂的解决方案）。我的方法是使用quadtree 来组织我放置在画布上的矩形。然后我基本上只是绕着中心点螺旋，试图放置新的矩形，并使用四叉树来检测碰撞。如果我检测到碰撞，那么我会将我试图放置的矩形移动到它所碰撞的矩形的边缘，该边缘离中心最远，并重复碰撞检查过程。
同样，这可能不是最复杂的方法，而且它确实会在矩形之间留下一些较大的间隙（它们之间的边界不均匀），但在我看来它给出了很好的结果。
【讨论】：