Javascript D3.js TopoJSON从csv在地图上绘制点和线

我试图使用CSV文件中的数据在地图上添加元素，目的是实现动态连接悬停，如本例http://bl.ocks.org/mbostock/7608400所示

我一直在尝试使用这个示例——使用相同的csv绘制点，但是我对此非常陌生，无法理解问题的根源。 下面是显示地图元素的d3调用，我在这里添加了要添加的点（圆）

d3.json("js/World.json",function(error,geodata) {
  if (error) return console.log(error);

    features.selectAll("path")
        .data(topojson.feature(geodata,geodata.objects.collection).features) 
        .enter()
        .append("path")
        .attr("d",path)
        .on("mouseover",showTooltip)
        .on("mousemove",moveTooltip)
        .on("mouseout",hideTooltip)
        .on("click",clicked);

    d3.csv("csv/us.csv", function(error, data) {
        features.selectAll("circle")
           .data(data)
           .enter()
           .append("circle")
           .attr("cx", function(d) {
                   return projection([d.lon, d.lat])[1];
           })
           .attr("cy", function(d) {
                   return projection([d.lon, d.lat])[0];
           })
           .attr("r", 30)
           .style("fill", "red");
    });

});

其余代码可在以下位置找到：

CSV的内容如下（一个很小的片段，以避免文章泛滥）：

名称、描述、纬度、经度
阿拉巴马州蒙哥马利市，32.377716，-86.300568
阿拉斯加，朱诺，58.301598，-134.420212
亚利桑那州，凤凰城，33.448143，-112.096962
阿肯色州，小石城，34.746613，-92.288986
加利福尼亚州萨克拉门托，38.576668，-121.493629
科罗拉多州丹佛市，39.739227，-104.984856
康涅狄格州，哈特福德，41.764046，-72.682198
特拉华州，多佛，39.157307，-75.519722
夏威夷，檀香山，21.307442，-157.857376
佛罗里达州塔拉哈西，30.438118，-84.281296
乔治亚州，亚特兰大，33.749027，-84.388229

点被绘制并显示在div中，但是它们都被分解成一个点x:0，y:0，错误是cx和cy接收到NaN值。

传递过程中的问题是否在.attr中协调

另外，如果我对这个问题的解释不够详细，请让我知道，这样我就可以在被否决之前对它进行扩展。
您需要在这里提供更多的代码。特别是，您是如何创建投影的？您确定您的lat/lon在该投影范围内吗？另外，快速浏览一下，您的索引在
cx
/
cy
上是向后的，并尝试将您的lat/LONG转换为数字：
.attr（“cx”，函数（d）{返回投影（[+d.lon，+d.lat]）[0]；}
我已将链接添加到一个JSFIDLE，在那里我上传了我的所有代码，但由于缺少TopoJSON和CSV文件，它没有在那里执行。投影是mercator，但是您是正确的。当我尝试在Mozilla inspector中将它们更改为实际值时，投影似乎是错误的，即使NaN值有错误坐标，它们几乎不移动。我尝试过使用您的代码，但不幸的是NaN值存在相同的问题。PS。点位于同一位置，因此没有与格式相关的问题。