【问题标题】:layout algorithm for tightly-packed image thumbnails紧凑的图像缩略图的布局算法
【发布时间】:2023-03-10 01:10:01
【问题描述】:

我正在制作一个图片库,我想将图片缩略图紧紧地打包在一起。缩略图是:

  • 不同的纵横比
  • 在相同的源分辨率下可用(最长边 256 像素)

我想提出一个让我能够平衡的最佳解决方案(可能必须是启发式的):

  • 每个缩略图之间的填充(最好是常量)
  • 缩略图大小的一致性(最好都是相同大小)
  • 为显示而裁剪的每张图像的数量(最好没有)
  • 图像的接近程度与其排序顺序一致(最好排序邻居在网格中彼此靠近)

我认为这是rectangle packing problem 的变体。

我找到了一些很好的参考资料:Fast Optimizing Rectangle Packing Algorithm for Building CSS Sprites

但我想咨询专家,看看是否有人知道:

【问题讨论】:

  • 我想知道是否需要创建某种神经网络,其中每个平衡点都成为节点上的权重(维基百科:link)。
  • 如果您考虑一列图像,问题就会变得非常简单。没有包装,可能保存两个并排的肖像图像,只是一长串图像。当我介绍第二列时,现在每个图像只能放置几个位置(在 1 下,在 2 下,在 1 旁边,在 2 旁边)。也许这是构建复杂算法的最简单方法?
  • 不要在 cmets 中写下你的问题的解释,编辑你的问题。 SO 上的很多人不阅读 cmets,主要是它们并不是非常有用,我们中的很多人都将它们过滤掉了。
  • 谢谢马克,但是如果您阅读它们,您会发现它们实际上并不是问题的一部分。他们是这个问题的专家——想法比什么都重要。我不想将这个问题与我关于解决方案可能是什么样子的虚假胡言乱语混淆,正是因为我知道 SO 上的许多人不阅读 cmets。
  • 这样说,这个问题很难回答,因为这是某种多目标优化问题。你可以使用所有关于 2d-packing 和所有其他东西的可用知识,但也许你必须首先设计一些度量/成本函数/评估函数:你需要决定,哪个优化标准是如何重要(这是一种心理学或试错驱动的任务)。当您拥有此功能时,您可以实现一些数学优化算法或研究启发式算法,这些算法对您的指标非常有效。

标签: algorithm thumbnails heuristics packing rectangles


【解决方案1】:

我想出了这样的东西(现在也有 github 上的代码) https://mendrik.github.io/diorama/

我应该补充一点,顺序是随机的,尺寸尽量统一,但对我来说,填满整个空间比保持尺寸一致更重要。您可以调整浏览器窗口的大小以查看其工作原理。

如果您的身高不固定,还有其他几种选择,主要是背包或分区算法。 2d bin 支持会给您留下空白或找不到始终适合所有图像的解决方案。

我的算法几乎没有裁剪,并且总是适合所有图像到给定的空间,只要有足够的组合可以这样做。图片越少,裁剪越明显。

【讨论】:

  • 这让安德烈亚斯印象深刻。它工作得非常好。我不清楚它是否是 1) 任何公开可用的已建立算法,2) 任何实现它们的开源库或 3) 任何其他数学参考或指导。如果它是 4) 一个非常酷的演示,那没问题。
  • 很公平。祝你好运。
猜你喜欢
  • 2018-12-14
  • 1970-01-01
  • 2011-02-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-04-04
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多