Question

此问题此前已接近“过于模糊”。由于我非常渴望得到答案，让我再试一次。

我花了几天时间寻找并尝试为控件找到基于JavaScript的实现，我称之为更好的术语horizontal grid。为了帮助您理解我的意思，让我们从常规网格开始。假设我有一个包含历史数据的数据库表，用于发送我想要显示的一些自动部件。在常规网格（表）控件中，它看起来像这样：

Date | Part 1 | Part 2 | Part 3 |
---------------------------------
3/15 |   5    |   6    |   7    |  |
3/16 |   4    |   3    |   1    |  |
3/17 |   2    |   4    |   5    |  V
3/18 |   5    |   1    |   8    |

现在，想象一下我需要表示水平增长的相同数据集。这个想法是规则网格的行和列被反转，并且网格不是从顶部到底部填充，而是从左到右填充。想想已翻转的常规网格：

       |3/15| 3/16| 3/17| 3/18|
------------------------------- 
Part 1 |  5 |   4 |  2  |  5  |
Part 2 |  6 |   3 |  4  |  1  |
Part 3 |  7 |   1 |  5  |  8  |

            --->

使用小型数据集，我可以使用HTML表格执行此操作，但问题是数据集可能非常大（并且是动态的），因此当网格滚动到分页时，分页或自动上载其他记录会很不错右边。

正如我所提到的，进行搜索并没有真正发现任何事情。我愿意从头开始编写代码，但在开始之前我会很好地获得一些关于现有控件的建议，我可以用这种方式重做

Answer 1

我相信你想要做的就是称为矩阵换位。在这里，我们可以在javascript中使用array和underscore.js website

来完成

var autoParts =[
    ['Date', 'Part 1 ', 'Part 2', 'Part 3'],
    ['3/15', 5, 6, 7],
    ['3/16', 4, 3, 1],
    ['3/17', 2, 4, 5],
    ['3/18', 5, 1, 8]
]

var rotatedAutoParts = _.zip.apply(null, autoParts);

rotatedAutoParts现在包含：

[
    ["Date", "3/15", "3/16", "3/17", "3/18"],
    ["Part 1 ",5, 4, 2, 5],
    ["Part 2",6, 3, 4, 1],
    ["Part 3", 7, 1, 5, 8]
]

正确设置数据后，您应该能够快速重新填充HTML表格。

水平（旋转）网格

1 个答案: