php – 用于将数组数据准备到另一个结构以使用某些规则呈现定义的HTML输出的算法

2023年8月24日 121次阅读

拜托,很长一段时间我没有成功找到解决方案(对我来说非常困难)的问题,我非常感谢任何帮助：

1)我有像这样的简单数组中的数据,没有问题：

$data = array(
    array('id => 1', 'name' => 'Some name 1'),
    array('id => 2', 'name' => 'Some name 2'),
    array('id => 3', 'name' => 'Some name 3'),
    ...
);

2)但我必须在上面呈现数据到HTML结构理论上非常类似于树结构,其中每个父节点有最多4个叶子,并且每个节点可以成为接下来4个子节点的父节点(没有树深度的任何限制).

a)因此,如果我在阵列中只有4个项目,则在网站上呈现：

<div class="group">
    <div class="group"><a href="#">Item 1</a></div>
    <div class="group"><a href="#">Item 2</a></div>
    <div class="group"><a href="#">Item 3</a></div>
    <div class="group"><a href="#">Item 4</a></div>
</div>

b)如果是5个项目,它应该像这样呈现：

<div class="group">
    <div class="group"><a href="#">Item 1</a></div>
    <div class="group"><a href="#">Item 2</a></div>
    <div class="group"><a href="#">Item 3</a></div>
    <div class="group">
        <div class="group"><a href="#">Item 4</a></div>
        <div class="group"><a href="#">Item 5</a></div>
    </div>
</div>

c)如果是6个项目,它应该像这样呈现：

<div class="group">
    <div class="group"><a href="#">Item 1</a></div>
    <div class="group"><a href="#">Item 2</a></div>
    <div class="group">
        <div class="group"><a href="#">Item 3</a></div>
        <div class="group"><a href="#">Item 4</a></div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 5</a></div>
        <div class="group"><a href="#">Item 6</a></div>
    </div>
</div>

d)如果有16个项目,它应该像这样呈现：

<div class="group">
    <div class="group">
        <div class="group"><a href="#">Item 1</a></div>
        <div class="group"><a href="#">Item 2</a></div>
        <div class="group"><a href="#">Item 3</a></div>
        <div class="group"><a href="#">Item 4</a></div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 5</a></div>
        <div class="group"><a href="#">Item 6</a></div>
        <div class="group"><a href="#">Item 7</a></div>
        <div class="group"><a href="#">Item 8</a></div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 9</a></div>
        <div class="group"><a href="#">Item 10</a></div>
        <div class="group"><a href="#">Item 11</a></div>
        <div class="group"><a href="#">Item 12</a></div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 13</a></div>
        <div class="group"><a href="#">Item 14</a></div>
        <div class="group"><a href="#">Item 15</a></div>
        <div class="group"><a href="#">Item 16</a></div>
    </div>
</div>

e)如果是21个项目,它应该像这样呈现：

<div class="group">
    <div class="group">
        <div class="group"><a href="#">Item 1</a></div>
        <div class="group"><a href="#">Item 2</a></div>
        <div class="group"><a href="#">Item 3</a></div>
        <div class="group">
            <div class="group"><a href="#">Item 4</a></div>
            <div class="group"><a href="#">Item 5</a></div>
        </div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 6</a></div>
        <div class="group"><a href="#">Item 7</a></div>
        <div class="group"><a href="#">Item 8</a></div>
        <div class="group">
            <div class="group"><a href="#">Item 9</a></div>
            <div class="group"><a href="#">Item 10</a></div>
        </div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 11</a></div>
        <div class="group"><a href="#">Item 12</a></div>
        <div class="group"><a href="#">Item 13</a></div>
        <div class="group">
            <div class="group"><a href="#">Item 14</a></div>
            <div class="group"><a href="#">Item 15</a></div>
        </div>
    </div>
    <div class="group">
        <div class="group"><a href="#">Item 16</a></div>
        <div class="group"><a href="#">Item 17</a></div>
        <div class="group"><a href="#">Item 18</a></div>
        <div class="group">
            <div class="group"><a href="#">Item 19</a></div>
            <div class="group"><a href="#">Item 20</a></div>
            <div class="group"><a href="#">Item 21</a></div>
        </div>
    </div>
</div>

以上显示的示例是为全背景屏幕划分为4个主要相等区域,这4个区域内部最多还包含4个区域,这些区域中的每个区域也可以包含下4个区域等.

如果模4的项的总计数总数为0,则网站上的宽度和高度区域相同,但是有些区域更大,有些区域分成更多的子项,为此目的,上面描述的HTML代码工作正常(在静态页面上)它测试得很好).

所以我有一个很大的问题就是找到如何将简单的数组数据转换成一些好的结构,以便通过任何递归函数或其他东西来处理以呈现所需的结果.

但正如我写的那样,我并不成功,主要是因为每个新的子容器都应该从最后的结构开始创建,并且统一为主要的4个象限.

我在这里是有帮助的回答你的问题,如果你会很高兴帮助我:)

我知道描述它足够清楚有点复杂……

最佳答案 这比我想象的要复杂一点,因为你想要分发你的物品.但这应该可以解决问题.

函数arrangeGroups()将创建一个与您描述的嵌套数组.创建一个将此数据呈现为嵌套div的函数应该没有问题.

我添加了一些设置代码,以动态生成任意数量的数组条目.使测试更容易.

define('GROUP_SIZE', 4);

$things = array();

for($idx=1; $idx<=21; $idx++)
    $things[] = array( 'id'=>$idx, 'name'=>"Some name $idx" );

$groups = arrangeGroups($things);
print_r($groups);

function arrangeGroups($items) {
    $tempGroups = array();
    $itemCount = count($items); // we use this a lot.

    // The hardest part here is figuring out how many items go into each group.
    // Build an array of how big each subgroup should be.
    // Put all the remainder items at the end of the array.
    // Six items divided into four groups will yield the array
    // (1, 1, 2, 2)
    $groupings = array_fill(0, GROUP_SIZE, intval($itemCount/GROUP_SIZE));
    $remainder = $itemCount % GROUP_SIZE ;
    for ($idx=$remainder; $idx>0; $idx--)
        $groupings[GROUP_SIZE-$idx]++;

    // now we just create slices of the array we were given, using $groupings as our guide
    $offset = $idx = 0;
    do {
        $sliceSize = $groupings[$idx];

        if ( $sliceSize == 1 )
            $tempGroups[] = $items[$offset];
        else if ( $sliceSize > 1 )
            $tempGroups[] = arrangeGroups( array_slice($items, $offset, $sliceSize) );

        $offset += $sliceSize;
        $idx++;
    } while ($idx < GROUP_SIZE);

    return $tempGroups;
}
点赞