D3.js D3从geojson中绘制单个元素

我对JS和D3js都很陌生。我试图在地图上创建一个圆，通过我的数据进行变换（大小先增大后减小）。但是，从本例中可以看出，svg中添加了4个元素。它们的大小也会同时变化。但是，我想要创建一个圆，而不是使用count字段创建过渡。链接到我的当前区块：

---

谢谢

如果您执行

console.log（data.features.length）

，您将得到结果

4

。这意味着

data.features

有4个数组，当然，您的输入选择将有4个圆圈

由于这些阵列似乎具有相同的地理位置（所有阵列都指向市政厅并具有相同的坐标，即151.2062183，-33.8732664“），因此仅使用其中一个阵列。例如，第一个数组：

var circle = svg.append("circle")
    .datum(data.features[0]);

这将只为第一个元素附加一个圆

这是您更新的bl.ocks:

您的代码：

var circle = svg.selectAll("circle")
  .data(data.features)
  .enter()
  .append("circle");

将为数组

数据中的每个项目附加一个圆圈。功能

（假设没有圆圈）。由于数组中有四个项，因此将有四个圆。如果只想附加一个圆，请将输入数据数组更改为一个要素的数组：

.data（[data.features[0]]）.enter（）.append（）…

然后，在初始附加之后，当您要转换到新功能时，可以更新该数据：

.data([data.features[i]])
  .attr("attr to be updated",...)

以下示例将此方法应用于非地理环境： 1.附加一个特征， 2.使用数组中下一项的属性更新功能， 3.重复：

var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，400）
.attr（“高度”，400）；
var数据=[{x:100，y:100，r:10}，{x:200，y:100，r:30}，{x:200，y:200，r:10}，{y:200，x:100，r:25}]；
var circle=svg.selectAll（“circle”）
.data（[数据[0]]）
.输入（）
.附加（“圆圈”）
.attr（“cx”，函数（d）{return d.x；}）
.attr（“cy”，函数（d）{返回d.y；}）
.attr（“r”，函数（d）{返回d.r；}）；
var i=0；
过渡（）；
函数转换（）{
circle.data（[data[++i%4]]）//获取数据数组中的下一项，将该数据分配给特征
.transition（）
.attr（“cx”，函数（d）{return d.x；}）//更新功能的属性
.attr（“cy”，函数（d）{返回d.y；}）
.attr（“r”，函数（d）{返回d.r；}）
.each（“end”，transition）//循环
.期限（2000年）
}

---

谢谢Gerardo，但这只返回第一条记录。如果查看数据，同一位置有4条记录。我想用一个圆来转换计数，也就是说，它先变大后变小。好吧，在这种情况下，你有一个完全不同的问题！我建议你编辑你的问题，准确地解释期望的结果，这样人们可以更好地帮助你。