D3.js 使用JSON-D3布局包时，X和Y为NaN

我正在尝试使用D3布局包来制作某种气泡图。然而，如果我尝试实现它，我会发现我的X和Y是NaN

这是我的一部分作品

正如您在控制台中看到的，我得到错误

属性转换：预期数字，“translate（NaN，NaN）”

。我做错了什么

编辑：我一直在跟踪。我甚至尝试将该数据记录到console.log中，并将其与我的数据进行比较。我没有得到r、x或y，而另一个得到了。

如果您查看它的状态：

首先为层次结构中的根节点调用子访问器

它还与一些示例数据放在一起

{
 "name": "flare",
 "children": [
  {
   "name": "analytics",
   "children": [
    {
     "name": "cluster",
     "children": [
      {"name": "AgglomerativeCluster", "size": 3938},
      {"name": "CommunityStructure", "size": 3812},
      {"name": "MergeEdge", "size": 743}
     ]
    },
    {
     "name": "graph",
     "children": [
      {"name": "BetweennessCentrality", "size": 3534},
      {"name": "LinkDistance", "size": 5731}
     ]
    }
   ]
  }
 ]
}

提供给包布局的数据需要采用这种分层形式。但是，如果我们看一下您的示例，您提供了一个数据数组，其中没有一个项具有

子属性。您需要修改数据的形状才能使用此布局

const newData = [
                {
                "adjective": 
                    {
                        "en": "warm",
                        "sv": "varm"}
                },
                {
                    "adjective": 
                    {
                        "en": "clear",
                        "sv": "tydlig"
                    }
                },
                {
                    "adjective": 
                    {
                        "en": "creative",
                        "sv": "kreativ"
                    }
                },
                {
                    "adjective": 
                    {
                        "en": "responsible",
                        "sv": "ansvarstagande"
                    }
                },
                {
                    "adjective": 
                    {
                        "en": "social",
                        "sv": "social"
                    }
                },
                {
                    "adjective": 
                    {
                        "en": "calm",
                        "sv": "lugn"
                    }
        }
];