从扁平数组生成动态树形结构：如何确定元素位置规律？

我正在寻求从扁平数组创建动态树形结构的解决方案，示例输入为 [1, 2, 3, 4, 5, 6, 7]。我已确定所需的列数和行数，但卡在寻找元素位置的规律上，以便为元素设置合适的间距。

已知位置规则 #

• 迭代过程中我会获取列（column）和索引（index）信息
• 示例1：数字4的元素应位于第3列、第2行
• 示例2：若输入有3个元素，位置如下：
  • 第1个元素 -> 第1列、第2行
  • 第2个元素 -> 第2列、第1行
  • 第3个元素 -> 第2列、第3行

已实现的列数与行数计算方法 #

getColumnLength() {
  if (this.list.length <= 1) {
    return 1;
  }
  if (this.list.length <= 3) {
    return 2;
  }
  for (let i = 2; i <= this.list.length; i++) {
    let columnLength = Math.pow(2, i);
    if (columnLength >= this.list.length) {
      return i;
    }
  }
},
getRowLength() {
  return Math.pow(2, this.getColumnLength()) + 1;
}

附水平树形结构示意图：

恳请各位提供相关建议。

内容的提问来源于stack exchange，提问作者Tanvir Rahman