将图像放入拼贴画布答案

【问题标题】：Placing images into a Collage Canvas将图像放入拼贴画布
【发布时间】：2010-04-28 19:15:52
【问题描述】：

我有一系列不同尺寸的图片。我想将这些图像以一种自动拼贴的形式放置在画布上。有谁知道如何运用这个概念背后的逻辑？

我所有的图像的高度都可以被 36 像素整除，宽度可以被 9 像素整除。它们具有 mouseDown 功能，可让您拖放。放下图像时，图像会移动到最近的 x 点可被 9 整除，y 点可被 36 整除。画布顶部绘制了一个网格。

我已经根据高度对图像数组进行了排序，然后根据它们的宽度进行了排序。

imagesArray.sortOn("高度", Array.NUMERIC | Array.DESCENDING); imagesArray.sortOn("宽度", Array.NUMERIC | Array.DESCENDING);

我想将最大的图像 ( imageArray[0] ) 放入角落 x,y = 0,0。然后随机化其余图像并将它们放入拼贴画布中。

【问题讨论】：

【解决方案1】：

你正在尝试做的事情听起来像treemapping。

【讨论】：

【解决方案2】：

我认为这就是所谓的“Packing problem”或“2D bin packing problem”。谷歌搜索应该会找到一些信息，有效地做到这一点并不是一项简单的任务。如果您只有少量图像，简单的方法是：

随机...只是随机放置图像，直到无法容纳更多图像。运行此随机放置 10..100..1000 次或更多次，然后选择最佳结果（其中“最佳”由某些标准确定，例如浪费的空间最少，或大多数图片适合等）
李>
蛮力...尝试每一种可能的组合，一个接一个，然后选择“最好的”一个。这种方法的缺点是随着项目数量的增加，计算量会迅速增加。

【讨论】：

【解决方案3】：

我研究了树形图和打包问题。 .... 并最终决定在画布上创建一个包含所有点的数组，然后为它们分配一个空值。然后，我遍历我的图像数组并将它们放置在“空”的点上，并将它占据的所有点重新分配为图像的源名称。它工作得很好。但是创建数组肯定需要时间。

【讨论】：

【解决方案4】：

我做了一个不同的处理，我只是将所有图像调整到一个平铺大小并将其平铺到一个文档中。通过图层蒙版将图像居中裁剪为文件大小。粘贴图像滚动脚本http://www.mouseprints.net/old/dpr/PasteImageRoll.html http://www.mouseprints.net/old/dpr/PasteImageRoll.jsx

【讨论】：