Javascript 未捕获类型错误:无法调用未定义(d3强制布局)的方法“push”

Javascript 未捕获类型错误:无法调用未定义(d3强制布局)的方法“push”,javascript,d3.js,force-layout,Javascript,D3.js,Force Layout,我不明白为什么我在使用武力布局的时候会犯这样的错误。当我切换到从json文件读取节点时,它就开始了。如果我取消注释下面的行,它不会抛出错误。如果我按原样离开,我将无法调用未定义的方法“push”。我不确定是什么问题。我遗漏了什么吗 <html> <script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script> <script> d3.json

我不明白为什么我在使用武力布局的时候会犯这样的错误。当我切换到从json文件读取节点时,它就开始了。如果我取消注释下面的行,它不会抛出错误。如果我按原样离开,我将无法调用未定义的方法“push”。我不确定是什么问题。我遗漏了什么吗

<html>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script>
<script>

   d3.json("http://katejustin.com/autosys1.json", function(data) {

   //var nodes = {};

   //data.links.forEach(function(link) {
   //   link.source = nodes[link.source] || (nodes[link.source] = {name: link.source});
   //   link.target = nodes[link.target] || (nodes[link.target] = {name: link.target}); });


var width = 200,
    height = 200;

var svg = d3.select("body").append("svg:svg")
    .attr("width", width)
    .attr("height", height);

var force = d3.layout.force()
    //.nodes(d3.values(nodes))
    .nodes(data.nodes)
    .links(data.links)
    .size([width, height])
    .distance(100)
    .charge(-1000)
    .start();
});
</script>
</html>

问题是您试图通过链接中的名称访问节点。 在原始实现中,您可以通过索引访问节点

以下是我在这些情况下通常使用的技巧,即使我确信存在更简单的东西:

var findNode = function(id) {
    for (var i in force.nodes()) {
        if (force.nodes()[i]["name"] == id) return force.nodes()[i]
    };
    return null;
}

var pushLink = function (link) {
    //console.log(link)
    if(findNode(link.source)!= null && findNode(link.target)!= null) {        
        force.links().push ({
            "source":findNode(link.source),
            "target":findNode(link.target)
        })
    }
}

var force = d3.layout.force()
    .nodes(data.nodes)
    .size([width, height])
    .distance(100)
    .charge(-1000)
    .start();

data.links.forEach(pushLink)
因此,这些函数的目标是用表示force.nodes中节点的实际对象替换每个链接、其源和目标

您可以在此处找到一个可用的JSFIDLE:
通过控制台查看,因为可视化中没有显示任何内容。

-1,隔离问题您可以使用其下方的编辑按钮修改原始帖子。主要问题是您发布的第二个代码块。太多了,还有太多多余的东西。隔离问题的主要思想是创建一个测试文件,使您的问题最少地出现。例如,如果您在创建5个包含22个子菜单的下拉菜单时遇到问题,那么隔离问题只会有1个包含1个子菜单的下拉菜单和最少的CSS/JS。我去掉了其余的代码,因此它实际上没有做任何事情,但是,除非我取消注释这些行,否则它仍然会按照我的原始邮件断开。检查data.nodes和data.links是否有值hanks,这非常有用。你能解释一下它和这个有什么不同吗?这就是直接从JSON中获取节点数组,这正是我试图做的。或者是因为JSON中的链接引用了节点的索引。因此,在您的示例中,基本上是通过索引查找节点,并将其存储在源/目标链接数组中。这是有道理的,没错。节点由链接的源和目标中的索引引用。