- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想将表格从 csv 转换为层次结构。该表具有以下格式:
lvl1 lvl2 lvl3 size
A a 1 1
A a 2 2
A b 1 3
A b 2 4
B a 1 5
B a 2 6
B b 1 7
B b 2 8
转换为下面的 JSON 对象。
d3.nest
像这样:
var n = d3.nest()
.key(d => d.lvl1)
.key(d => d.lvl2)
.key(d => d.lvl3)
.entries(d)
这导致以下格式,这几乎是我想传递给
d3.hierarchy
的格式:
[{
"key": "A",
"values": [{
"key": "a",
"values": [{
"key": "1",
"values": [{
"lvl1": "A",
"lvl2": "a",
"lvl3": 1,
"size": 1
}]
},
{
"key": "2",
"values": [{
"lvl1": "A",
"lvl2": "a",
"lvl3": 2,
"size": 2
}]
}
]
}]
}
//...
]
但是,这增加了一个级别太多,理想情况下我希望有以下输出:
[{
"key": "A",
"values": [{
"key": "a",
"values": [{
"key": "1",
"size": 1
},
{
"key": "2",
"size": 2
}
]
}]
} //,...
]
这种格式我可以方便地传递给
d3.hierarchy(n, d => d.values)
.如何做到这一点?
[{
"key": "A",
"values": [{
"key": "a",
"values": [{
"key": "1",
"lvl1": "A",
"lvl2": "a",
"lvl3": 1,
"size": 1
},
{
"key": "2",
"lvl1": "A",
"lvl2": "a",
"lvl3": 2,
"size": 2
}
]
}]
} //,...
]
[{
"lvl1": "A",
"lvl2": "a",
"lvl3": 1,
"size": 1
},
{
"lvl1": "A",
"lvl2": "a",
"lvl3": 2,
"size": 2
},
{
"lvl1": "A",
"lvl2": "b",
"lvl3": 1,
"size": 3
},
{
"lvl1": "A",
"lvl2": "b",
"lvl3": 2,
"size": 4
},
{
"lvl1": "B",
"lvl2": "a",
"lvl3": 1,
"size": 5
},
{
"lvl1": "B",
"lvl2": "a",
"lvl3": 2,
"size": 6
},
{
"lvl1": "B",
"lvl2": "b",
"lvl3": 1,
"size": 7
},
{
"lvl1": "B",
"lvl2": "b",
"lvl3": 2,
"size": 8
}
]
最佳答案
您可以通过 rollup
获得您想要的东西:
const n = d3.nest()
.key(d => d.lvl1)
.key(d => d.lvl2)
.rollup(d => d.map(e => ({
key: e.lvl3,
size: e.size
})))
.entries(data);
这是演示:
const data = [{
"lvl1": "A",
"lvl2": "a",
"lvl3": 1,
"size": 1
},
{
"lvl1": "A",
"lvl2": "a",
"lvl3": 2,
"size": 2
},
{
"lvl1": "A",
"lvl2": "b",
"lvl3": 1,
"size": 3
},
{
"lvl1": "A",
"lvl2": "b",
"lvl3": 2,
"size": 4
},
{
"lvl1": "B",
"lvl2": "a",
"lvl3": 1,
"size": 5
},
{
"lvl1": "B",
"lvl2": "a",
"lvl3": 2,
"size": 6
},
{
"lvl1": "B",
"lvl2": "b",
"lvl3": 1,
"size": 7
},
{
"lvl1": "B",
"lvl2": "b",
"lvl3": 2,
"size": 8
}
];
var nested = d3.nest()
.key(d => d.lvl1)
.key(d => d.lvl2)
.rollup(d => d.map(e => ({
key: e.lvl3,
size: e.size
})))
.entries(data);
console.log(nested);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
关于javascript - 将平面表转换为层次结构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66256140/
我有一个对象: [ { TEAMGROUP: "AB", TEAMNAME: "TEAM1", SPRINTS: [ { ID: 1,
颜色模型和颜色空间之间的差异 RGB565 与 RGB888 有何不同任何建议链接 YUV vs RGB vs YCbCr。? 最佳答案 RGB 是一种加法颜色模型,其中红色、绿色和蓝色强度以不同的组
我正在从单个顶点/索引缓冲区绘制一个具有多个网格的完整对象,并且它们具有不同的纹理。因此,我想到将纹理 ID 与顶点一起从顶点着色器传递到片段着色器中的片段。问题是禁用插值。我正在使用 GLSL ve
我有一个包含 40000 个 float 的数组,用于指定 map 上的高度级别。我想在 OpenGL ES 2.0 中创建一个网格/平面,为该网格中的每个顶点分配一个来自该数组的高度值,以便它们创建
我真的很喜欢 IQ 的页面以及有关 SDF 的信息: ( https://www.iquilezles.org/www/articles/distfunctions/distfunctions.htm
我创建了 QPushButton在带有此样式表的 Qt Designer 中: QPushButton#pushButton { background-color: #ffffff; } QP
所以我正在寻找一些平面 map 的解决方法,因为它在 IE 上不起作用,我找到了这个:但我不太明白为什么它会起作用 var gadjets = [ {computers:['asus', 'hp'
child Actor 会不会太多?例如,如果我有一个有 10000 个 child Actor 的 Actor ,与每个有 1000 个 child Actor 的 10 个 Actor 相比,这会
我有一个由法线 (n) 和距离 (d)(距原点)定义的平面。我想把它改造成一个新的系统。 长路是这样的: 1) 将距离 (d) 与法线 (n) 相乘得到一个向量 (p) 2) 旋转 (R) 并平移 (
问题: 从球体中减去立方体会得到一个结果,其中 z 轴保留体积,但 y 轴和 x 轴产生平面圆盘,如图所示。我不确定为什么球体在那些方面正在失去体积。我正在使用 threeCSG 的典型减法。 代码:
我通过 SQL 查询从我们的 ERP 获取产品数据,由此返回的数据在大小级别非常平坦。一个产品有 3 个级别: 风格 颜色 尺寸 一种款式有多种颜色,一种颜色有多种尺码。 我创建了以下模型: publ
我正在尝试展开一些 json 数据。如果我像下面这样使用我的测试数据,一切正常! var data = [ { "title": 1, "parentids": [0] }, { "title
我希望使用 SceneKit 在 Swift 中的 3D 空间中绘制多个平面。具体来说,这些表面都将位于双曲面内。我以前从未绘制过自定义形状/对象,而且在尝试理解文档时我已经迷失了方向。 关于在 3D
预先感谢您阅读我的问题。我对 ARKit 非常陌生,并且已经学习了几个教程,这些教程向我展示了如何使用平面检测以及如何为平面使用不同的纹理。这个功能真的很棒,但这是我的问题。玩家是否可以先将飞机放置在
我正在阅读下面的源代码,我想知道我到底为什么要使用平面图方式。正如我所看到的,与通过 if 语句进行简单的 null 检查相比,实例化了更多的对象,执行了更多代码,这将在第一个 null 时终止,而不
我正在编写一个 Rails 应用程序并使用 Flat UI 进行样式设置。我目前正在将 flatui-rails gem 与 twitter-bootstrap-rails gem 结合使用。一切正常
我在维基百科中找到了射线平面相交代码的解决方案,该解决方案有效,我只是在其中求解线性方程组。 后来我找到了一些点到平面投影的代码,显然实现方式不同,并且在特定条件下也会产生不同的解决方案。 但是,我并
我正在使用 http://designmodo.github.io/Flat-UI/ 中的扁平 UI 我复制了复选框示例页面中的所有文件和代码。 但是我注意到该复选框并未显示为样式复选框,但在我单击初
这个问题已经有答案了: True Isometric Projection with HTML5 Canvas (3 个回答) 已关闭 7 年前。 我想创建一个等轴测图。该 map 存在等距矩形,如图
http://designmodo.github.io/Flat-UI/ 我想创建一个 Css 下拉菜单,我已经完成了下拉部分,但是我似乎无法模拟转换,也不知道如何编写这些代码。这是我目前所知道的,在
我是一名优秀的程序员,十分优秀!