在较大的矩形中拟合不同大小的矩形的算法

时间:2012-09-24 08:09:01

标签: javascript algorithm math

我需要一个算法来计算较大矩形中矩形的最佳拟合...而较大的矩形会动态改变大小。更多细节:

我正在使用Code52 Metro UI项目:http://code52.org/metro.css/

我只使用了一个tile行,并且所有tile都定义了“float:left”。当所有瓷砖具有相同尺寸时,这可以很好地工作。用户可以将浏览器调整到任何宽度,并且瓷砖只是“下拉”在彼此之下。现在,当我想要不同的瓷砖尺寸时,问题就出现了。这打破了一切,显然人们通常将地铁UI设计为固定宽度。好吧,如果可能的话,我需要采用流畅的布局。平铺大小预先定义如下:

Single: 130px x 130px
Double Horizontal: 130px x 280px
Double Vertical: 280px x 130px
and Double Both: 280px x 280px

容器是流动的,因此宽度/高度会动态变化。

我需要的是一种最适合瓷砖的算法..所以任何空的空间只会在右下角而不会与瓷砖混合在一起。这里有任何数学天才有想法吗?

1 个答案:

答案 0 :(得分:1)

您可能需要查看jQuery Masonary。它适用于任何尺寸的瓷砖。首页上的示例甚至完全符合您的要求。