在JavaScript中以编程方式计算给定面积和比率的宽度和高度

Question

好的，所以我需要创建一个＆＃34;自动适应＆＃34;单击按钮时的功能。

假设您有一个区域，由于页面的响应性，该区域的大小可变。

此区域可以包含多个矩形（由登录的客户端数量指定）。

我需要在JavaScript中以编程方式计算，是每个客户端的适当宽度和高度，以便适应＆＃34;他们都在那个区域内。

var area = $('.client-container').width() * $('.client-container').height();
var noOfClients = 3; // normally calculated dynamically

// Ratio (1.25:1)
var r1 = 1.25;
var r2 = 1;

我如何确定应该应用于每个客户矩形的宽度和高度？

Answer 1

我假设您可以完全自由地调整N个客户端的大小，并且它们的自然宽高比可以简单地反映屏幕的宽高比。你不会总是能够让所有客户都相同，而不会浪费空间。取N的平方根，将其向下舍入，这是你的行数R.它也是你的列数，除了X = N-R * R客户不合适。 X小于R.只需选择底部的X行，然后将它们分成R + 1列。