如何在javascript中实现TileWindows算法？

我需要用div均匀地填充一些正方形。允许调整div的宽度和高度。我知道WINAPI有一个名为TileWindows的函数（这里描述），但我需要在JavaScript中实现相同的行为。那么，如何做到这一点呢？

是我自己发明的

注意事项：

1）

clientRect

是一个方形对象，由

元素返回。getBoundingClientRect（）

2）

对话框

是我们需要放置在正方形内的一组对象。（在我的例子中只是对话框窗口）。我实现了setTop、setWidth、setLeft、setHeight等方法，但您可以只使用

element.style.top=top+'px'等

function tileHorizontalDialogs(clientRect, dialogs) {
        var dialogsCount = dialogs.length;
        var top = clientRect.top;
        var left = clientRect.left;
        var XC = Math.floor(Math.sqrt(dialogsCount));
        var YC = Math.floor(dialogsCount / XC);
        var w = clientRect.width / XC;
        var h0 = clientRect.height / YC;
        var h1 = clientRect.height / (YC + 1);
        var modulo = dialogsCount % XC;
        var firstExtendedColumnNumber = XC - modulo + 1;
        var d = 0;
        for (var hIterator = 1; hIterator <= XC; hIterator++) {
            var h = 0;
            var vLimit = 0;
            if (hIterator < firstExtendedColumnNumber) {
                vLimit = YC;
                h = h0;
            }
            else if (hIterator >= firstExtendedColumnNumber) {
                vLimit = YC + 1;
                h = h1;
            }
            for (var vIterator = 1; vIterator <= vLimit; vIterator++) {
                dialogs[d].setTop(top);
                dialogs[d].setLeft(left);
                dialogs[d].setWidth(w);
                dialogs[d].setHeight(h);
                top += h;
                d++;
            }
            top = clientRect.top;
            left += w;
        }
    };
function tileVerticalDialogs(clientRect, dialogs) {
        var dialogsCount = dialogs.length;
        var top = clientRect.top;
        var left = clientRect.left;
        var YC = Math.floor(Math.sqrt(dialogsCount));
        var XC = Math.floor(dialogsCount / YC);
        var h = clientRect.height / YC;
        var w0 = clientRect.width / XC;
        var w1 = clientRect.width / (XC + 1);
        var modulo = dialogsCount % YC;
        var firstExtendedRowNumber = YC - modulo + 1;
        var d = 0;
        for (var vIterator = 1; vIterator <= YC; vIterator++) {
            var w = 0;
            var hLimit = 0;
            if (vIterator < firstExtendedRowNumber) {
                hLimit = XC;
                w = w0;
            }
            else if (vIterator >= firstExtendedRowNumber) {
                hLimit = XC + 1;
                w = w1;
            }
            for (var hIterator = 1; hIterator <= hLimit; hIterator++) {
                dialogs[d].setTop(top);
                dialogs[d].setLeft(left);
                dialogs[d].setWidth(w);
                dialogs[d].setHeight(h);
                left += w;
                d++;
            }
            left = clientRect.left;
            top += h;
        }
    };

function tileHorizontalDialogs（clientRect，dialogs）{
var dialogscont=dialogs.length；
var top=clientRect.top；
var left=clientRect.left；
var XC=Math.floor（Math.sqrt（dialogscont））；
var YC=数学楼层（dialogsCount/XC）；
var w=clientRect.width/XC；
var h0=中心高度/YC；
var h1=中心高度/（YC+1）；
var模=对话对象%XC；
var firstExtendedColumnNumber=XC-模+1；
var d=0；
对于（var hIterator=1；hIterator=firstExtendedColumnNumber）{
vLimit=YC+1；
h=h1；
}
对于（var vIterator=1；vIterator我不明白这个tileWindows函数是如何工作的。你能提供更多信息吗？你尝试过什么吗？@Jonas Grumann，它用窗口填充正方形。它可能会得到一个决定优先级的参数：水平或垂直。如果是水平，那么函数将尝试用窗口填充正方形，其中宽度将大于高度，反之亦然。