Javascript 在D3中，如何根据数据中的值为每个数据元素创建多个元素？

我有一个简单的数组，其中包含数据的对象，并从中生成div。与为每个数据元素只创建一个div不同，我希望创建几个div，具体取决于数据中显示的数字（作为对象的属性之一）

例如，如果数据元素的“num”为4，它将生成4个div

以下是我对这部分的代码：

data = [
  {num: 4, category: 'A'},
  {num: 3, category: 'B'},  
  {num: 2, category: 'D'},  
  {num: 5, category: 'A'}    
]

d3.select('body')
  .selectAll('div')
  .data(data)
  .enter()
  .append('div')
  .text((d)=> d.num)
  .style('width', (d) => d.num * 20 + "px")

我曾尝试用for循环来解决它，但我不知道如何在D3选择的中间循环，同时仍然可以访问数据。p> 任何想法都将不胜感激

以下是我的做法：

数据=[{
数字：4，
类别：“A”
}, {
数字：3，
类别：“B”
}, {
数字：2，
类别：“D”
}, {
总数：5，
类别：“A”
}]
d3.选择（'主体'）
.selectAll（'div'））
.data（data）//绑定我们的数据
.输入（）
//内部选择
.selectAll（'div'））
//内部选择数据绑定
//创建长度为num的重复基准数组
.数据（（d）=>
d3.范围（d.num）.map（（）=>d）
) 
.输入（）
.append（'div'））
.text（（d）=>d.num）
.style（'width'，（d）=>d.num*20+“px”）；

只需将

num

数据加入到子

div

元素中，然后

enter

这些元素？可能对您有用：谢谢您的评论！我是D3新手，所以我不确定我是否完全理解你的意思。是否需要选择子div，然后再次输入数据？它将如何生成多个元素？我在前面看到了这个问题，但我不确定如何访问数据，因为我想根据每个数据元素中的数字生成x个div，如果这是有意义的……你应该考虑的是改变你使用的数据结构来为你想要创建的每一个元素都有一个条目。虽然可能有许多变通方法，但当数据点和元素之间有1对1的映射时，d3最容易使用。