个人中心
gpt4 book ai didi

javascript - 未捕获的类型错误 : Cannot call method 'push' of undefined (d3 force layout)

转载 作者：行者123 更新时间：2023-11-30 18:00:18 25 4
gpt4 key购买 nike

我一直想不通为什么会出现这个错误(使用强制布局)。当我切换到从 json 文件读取我的节点时，它就开始了。如果我取消注释下面的行，它不会引发错误。如果我按原样离开，我会得到“无法调用未定义的‘推’方法”。我不确定是什么问题。我错过了什么吗？

<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>

最佳答案

问题是您尝试通过链接中的 name 访问节点。在最初的实现中，您通过索引访问节点。

这是我通常在这些情况下使用的技巧，即使我确定存在更简单的方法也是如此:

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 中节点的实际对象替换每个链接、其源和目的地。

您可以在这里找到一个可用的 jsFiddle:http://jsfiddle.net/chrisJamesC/nrbQ4/1/(通过控制台查看，因为可视化中没有显示任何内容)。

关于javascript - 未捕获的类型错误 : Cannot call method 'push' of undefined (d3 force layout)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17181421/

25 4 0
文章推荐： javascript - 我如何告诉 Mocha 只在浏览器中运行某个测试(而不是在 node.js 中)？
文章推荐： c# - 使用 c# asp.net 更新 Web 应用程序中的用户信息
文章推荐： c# - 无需用户干预即可获取访问 token C# SDK
文章推荐： javascript - jquery when 文档的响应和错误
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com