javascript - 将固定面积的矩形拟合成更大的矩形

标签 javascript

我有一个10*10的大矩形,面积为100。我正在寻找一种方法来适应,例如:将固定区域的6个矩形放入10*10的区域中。

这 6 个矩形有固定的面积,但没有固定的宽度/高度。它们的面积总和为 100,因此它实际上是较大面积的百分比。

我不想有 1 行,只需更改每个矩形的宽度。我想要一种以最有效的方式放置矩形的方法,尽量使它们尽可能接近正方形。

谢谢。

-已解决-

最佳答案

有几种方法可以做到这一点,因此我将仅给出一个简单易懂(虽然有些低效)的方法示例,但该方法仍应给出相当不错的结果。

  1. 首先按照从大到小的顺序对盒子进行排序。
  2. 假设您的第一个盒子将是正方形(它不会以这种方式结束,但会以闭合的方式结束)。使用 sqrt(area[1]) 获取其边长。将该宽度作为您想要的第一列的宽度。
  3. 给定该宽度,在该列中填充尽可能多的行。
  4. 将您在该列中放置的总面积相加;调整其宽度以匹配该宽度(现在会更薄一些)。
  5. 对其余可用框重复步骤 1-3。当列中第一个框的目标宽度比剩余空间宽时,只需使用该宽度即可。
  6. 剩余的方框应完全适合该列中的剩余空间。

这将为您提供对齐的列,并具有不同的高度划分。作为替代方案,您可以翻转“行”和“列”以获得具有不同列分割的恒定行分割。

关于javascript - 将固定面积的矩形拟合成更大的矩形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47024331/

相关文章:

javascript - 从 Angular Controller 访问输入字段会导致未定义

javascript - 创建 Javascript 函数时,我应该检查参数是否未定义吗?

javascript - 为什么我不能从 JavaScript 中的另一个函数调用一个函数?

javascript - 如何绑定(bind)到 Aurelia 中的编码图像?

javascript - 函数调用本身不起作用(无限循环,Javascript)

javascript - 为什么 d3.arc() 给我的是函数而不是路径字符串?

javascript - 带有图标的数据表不根据其他列对列进行排序

javascript - 使用 ajax 加载选项卡内容 onclick

javascript - 浏览器推送通知获取文本

javascript - 只是无法让 Passport.js 工作