我不知道我的 D3 图表不起作用。我已经尝试了两天没有结果。它抛出一个 TypeError: Cannot read property 'push' of undefined 错误。这是完整的代码
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<style>
.link {
stroke: #666;
opacity: 0.9;
stroke-width: 1.5px;
}
.node circle {
stroke: #fff;
opacity: 0.9;
stroke-width: 1.5px;
}
.node:not(:hover) .nodetext {
display: none;
}
text {
font: 7px serif;
opacity: 0.9;
pointer-events: none;
}
</style>
<script src=http://d3js.org/d3.v3.min.js></script>
<script>
var links = [ { "source" : "A", "target" : "B", "value" : "1" }, { "source" : "A", "target" : "C", "value" : "2" }, { "source" : "A", "target" : "D", "value" : "3" }, { "source" : "A", "target" : "J", "value" : "4" }, { "source" : "B", "target" : "E", "value" : "5" }, { "source" : "B", "target" : "F", "value" : "6" }, { "source" : "C", "target" : "G", "value" : "7" }, { "source" : "C", "target" : "H", "value" : "8" }, { "source" : "D", "target" : "I", "value" : "9" } ] ;
var nodes = [ { "name" : "Myriel", "group" : "1" }, { "name" : "Napoleon", "group" : "1" }, { "name" : "Mlle.Baptistine", "group" : "1" }, { "name" : "Mme.Magloire", "group" : "1" }, { "name" : "CountessdeLo", "group" : "1" }, { "name" : "Geborand", "group" : "1" }, { "name" : "Geborand", "group" : "1" }, { "name" : "Geborand", "group" : "1" }, { "name" : "Geborand", "group" : "1" } ] ;
var width = 550
height = 400;
var color = d3.scale.category20();
var force = d3.layout.force()
.nodes(d3.values(nodes))
.links(links)
.size([width, height])
.linkDistance(50)
.charge(-120)
.on("tick", tick)
.start();
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var link = svg.selectAll(".link")
.data(force.links())
.enter().append("line")
.attr("class", "link")
.style("stroke-width", function(d) { return Math.sqrt(d.value); });
var node = svg.selectAll(".node")
.data(force.nodes())
.enter().append("g")
.attr("class", "node")
.style("fill", function(d) { return color(d.group); })
.style("opacity", 0.9)
.on("mouseover", mouseover)
.on("mouseout", mouseout)
.call(force.drag);
node.append("circle")
.attr("r", 6)
node.append("svg:text")
.attr("class", "nodetext")
.attr("dx", 12)
.attr("dy", ".35em")
.text(function(d) { return d.name });
function tick() {
link
.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
}
function mouseover() {
d3.select(this).select("circle").transition()
.duration(750)
.attr("r", 16);
d3.select(this).select("text").transition()
.duration(750)
.attr("x", 13)
.style("stroke-width", ".5px")
.style("font", "17.5px serif")
.style("opacity", 1);
}
function mouseout() {
d3.select(this).select("circle").transition()
.duration(750)
.attr("r", 8);
}
</script>
</body>
上面的文件有什么问题？
例如，我有一个类似的测试文件，可以正常工作。这是这里
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<style>
.link {
stroke: #666;
opacity: 0.9;
stroke-width: 1.5px;
}
.node circle {
stroke: #fff;
opacity: 0.9;
stroke-width: 1.5px;
}
.node:not(:hover) .nodetext {
display: none;
}
text {
font: 7px serif;
opacity: 0.9;
pointer-events: none;
}
</style>
<script src=http://d3js.org/d3.v3.min.js></script>
<script>
var links = [ { "source" : 1, "target" : 0, "value" : 1 }, { "source" : 2, "target" : 0, "value" : 8 }, { "source" : 3, "target" : 0, "value" : 10 }, { "source" : 3, "target" : 2, "value" : 6 }, { "source" : 4, "target" : 0, "value" : 1 }, { "source" : 5, "target" : 0, "value" : 1 }, { "source" : 6, "target" : 0, "value" : 1 }, { "source" : 7, "target" : 0, "value" : 1 }, { "source" : 8, "target" : 0, "value" : 2 }, { "source" : 9, "target" : 0, "value" : 1 }, { "source" : 11, "target" : 10, "value" : 1 }, { "source" : 11, "target" : 3, "value" : 3 }, { "source" : 11, "target" : 2, "value" : 3 }, { "source" : 11, "target" : 0, "value" : 5 }, { "source" : 12, "target" : 11, "value" : 1 }, { "source" : 13, "target" : 11, "value" : 1 }, { "source" : 14, "target" : 11, "value" : 1 }, { "source" : 15, "target" : 11, "value" : 1 }, { "source" : 17, "target" : 16, "value" : 4 }, { "source" : 18, "target" : 16, "value" : 4 }, { "source" : 18, "target" : 17, "value" : 4 }, { "source" : 19, "target" : 16, "value" : 4 }, { "source" : 19, "target" : 17, "value" : 4 }, { "source" : 19, "target" : 18, "value" : 4 }, { "source" : 20, "target" : 16, "value" : 3 }, { "source" : 20, "target" : 17, "value" : 3 }, { "source" : 20, "target" : 18, "value" : 3 }, { "source" : 20, "target" : 19, "value" : 4 }, { "source" : 21, "target" : 16, "value" : 3 }, { "source" : 21, "target" : 17, "value" : 3 }, { "source" : 21, "target" : 18, "value" : 3 }, { "source" : 21, "target" : 19, "value" : 3 }, { "source" : 21, "target" : 20, "value" : 5 }, { "source" : 22, "target" : 16, "value" : 3 }, { "source" : 22, "target" : 17, "value" : 3 }, { "source" : 22, "target" : 18, "value" : 3 }, { "source" : 22, "target" : 19, "value" : 3 }, { "source" : 22, "target" : 20, "value" : 4 }, { "source" : 22, "target" : 21, "value" : 4 }, { "source" : 23, "target" : 16, "value" : 3 }, { "source" : 23, "target" : 17, "value" : 3 }, { "source" : 23, "target" : 18, "value" : 3 }, { "source" : 23, "target" : 19, "value" : 3 }, { "source" : 23, "target" : 20, "value" : 4 }, { "source" : 23, "target" : 21, "value" : 4 }, { "source" : 23, "target" : 22, "value" : 4 }, { "source" : 23, "target" : 12, "value" : 2 }, { "source" : 23, "target" : 11, "value" : 9 }, { "source" : 24, "target" : 23, "value" : 2 }, { "source" : 24, "target" : 11, "value" : 7 }, { "source" : 25, "target" : 24, "value" : 13 }, { "source" : 25, "target" : 23, "value" : 1 }, { "source" : 25, "target" : 11, "value" : 12 }, { "source" : 26, "target" : 24, "value" : 4 }, { "source" : 26, "target" : 11, "value" : 31 }, { "source" : 26, "target" : 16, "value" : 1 }, { "source" : 26, "target" : 25, "value" : 1 }, { "source" : 27, "target" : 11, "value" : 17 }, { "source" : 27, "target" : 23, "value" : 5 }, { "source" : 27, "target" : 25, "value" : 5 }, { "source" : 27, "target" : 24, "value" : 1 }, { "source" : 27, "target" : 26, "value" : 1 }, { "source" : 28, "target" : 11, "value" : 8 }, { "source" : 28, "target" : 27, "value" : 1 }, { "source" : 29, "target" : 23, "value" : 1 }, { "source" : 29, "target" : 27, "value" : 1 }, { "source" : 29, "target" : 11, "value" : 2 }, { "source" : 30, "target" : 23, "value" : 1 }, { "source" : 31, "target" : 30, "value" : 2 }, { "source" : 31, "target" : 11, "value" : 3 }, { "source" : 31, "target" : 23, "value" : 2 }, { "source" : 31, "target" : 27, "value" : 1 }, { "source" : 32, "target" : 11, "value" : 1 }, { "source" : 33, "target" : 11, "value" : 2 }, { "source" : 33, "target" : 27, "value" : 1 }, { "source" : 34, "target" : 11, "value" : 3 }, { "source" : 34, "target" : 29, "value" : 2 }, { "source" : 35, "target" : 11, "value" : 3 }, { "source" : 35, "target" : 34, "value" : 3 }, { "source" : 35, "target" : 29, "value" : 2 }, { "source" : 36, "target" : 34, "value" : 2 }, { "source" : 36, "target" : 35, "value" : 2 }, { "source" : 36, "target" : 11, "value" : 2 }, { "source" : 36, "target" : 29, "value" : 1 }, { "source" : 37, "target" : 34, "value" : 2 }, { "source" : 37, "target" : 35, "value" : 2 }, { "source" : 37, "target" : 36, "value" : 2 }, { "source" : 37, "target" : 11, "value" : 2 }, { "source" : 37, "target" : 29, "value" : 1 }, { "source" : 38, "target" : 34, "value" : 2 }, { "source" : 38, "target" : 35, "value" : 2 }, { "source" : 38, "target" : 36, "value" : 2 }, { "source" : 38, "target" : 37, "value" : 2 }, { "source" : 38, "target" : 11, "value" : 2 }, { "source" : 38, "target" : 29, "value" : 1 }, { "source" : 39, "target" : 25, "value" : 1 }, { "source" : 40, "target" : 25, "value" : 1 }, { "source" : 41, "target" : 24, "value" : 2 }, { "source" : 41, "target" : 25, "value" : 3 }, { "source" : 42, "target" : 41, "value" : 2 }, { "source" : 42, "target" : 25, "value" : 2 }, { "source" : 42, "target" : 24, "value" : 1 }, { "source" : 43, "target" : 11, "value" : 3 }, { "source" : 43, "target" : 26, "value" : 1 }, { "source" : 43, "target" : 27, "value" : 1 }, { "source" : 44, "target" : 28, "value" : 3 }, { "source" : 44, "target" : 11, "value" : 1 }, { "source" : 45, "target" : 28, "value" : 2 }, { "source" : 47, "target" : 46, "value" : 1 }, { "source" : 48, "target" : 47, "value" : 2 }, { "source" : 48, "target" : 25, "value" : 1 }, { "source" : 48, "target" : 27, "value" : 1 }, { "source" : 48, "target" : 11, "value" : 1 }, { "source" : 49, "target" : 26, "value" : 3 }, { "source" : 49, "target" : 11, "value" : 2 }, { "source" : 50, "target" : 49, "value" : 1 }, { "source" : 50, "target" : 24, "value" : 1 }, { "source" : 51, "target" : 49, "value" : 9 }, { "source" : 51, "target" : 26, "value" : 2 }, { "source" : 51, "target" : 11, "value" : 2 }, { "source" : 52, "target" : 51, "value" : 1 }, { "source" : 52, "target" : 39, "value" : 1 }, { "source" : 53, "target" : 51, "value" : 1 }, { "source" : 54, "target" : 51, "value" : 2 }, { "source" : 54, "target" : 49, "value" : 1 }, { "source" : 54, "target" : 26, "value" : 1 }, { "source" : 55, "target" : 51, "value" : 6 }, { "source" : 55, "target" : 49, "value" : 12 }, { "source" : 55, "target" : 39, "value" : 1 }, { "source" : 55, "target" : 54, "value" : 1 }, { "source" : 55, "target" : 26, "value" : 21 }, { "source" : 55, "target" : 11, "value" : 19 }, { "source" : 55, "target" : 16, "value" : 1 }, { "source" : 55, "target" : 25, "value" : 2 }, { "source" : 55, "target" : 41, "value" : 5 }, { "source" : 55, "target" : 48, "value" : 4 }, { "source" : 56, "target" : 49, "value" : 1 }, { "source" : 56, "target" : 55, "value" : 1 }, { "source" : 57, "target" : 55, "value" : 1 }, { "source" : 57, "target" : 41, "value" : 1 }, { "source" : 57, "target" : 48, "value" : 1 }, { "source" : 58, "target" : 55, "value" : 7 }, { "source" : 58, "target" : 48, "value" : 7 }, { "source" : 58, "target" : 27, "value" : 6 }, { "source" : 58, "target" : 57, "value" : 1 }, { "source" : 58, "target" : 11, "value" : 4 }, { "source" : 59, "target" : 58, "value" : 15 }, { "source" : 59, "target" : 55, "value" : 5 }, { "source" : 59, "target" : 48, "value" : 6 }, { "source" : 59, "target" : 57, "value" : 2 }, { "source" : 60, "target" : 48, "value" : 1 }, { "source" : 60, "target" : 58, "value" : 4 }, { "source" : 60, "target" : 59, "value" : 2 }, { "source" : 61, "target" : 48, "value" : 2 }, { "source" : 61, "target" : 58, "value" : 6 }, { "source" : 61, "target" : 60, "value" : 2 }, { "source" : 61, "target" : 59, "value" : 5 }, { "source" : 61, "target" : 57, "value" : 1 }, { "source" : 61, "target" : 55, "value" : 1 }, { "source" : 62, "target" : 55, "value" : 9 }, { "source" : 62, "target" : 58, "value" : 17 }, { "source" : 62, "target" : 59, "value" : 13 }, { "source" : 62, "target" : 48, "value" : 7 }, { "source" : 62, "target" : 57, "value" : 2 }, { "source" : 62, "target" : 41, "value" : 1 }, { "source" : 62, "target" : 61, "value" : 6 }, { "source" : 62, "target" : 60, "value" : 3 }, { "source" : 63, "target" : 59, "value" : 5 }, { "source" : 63, "target" : 48, "value" : 5 }, { "source" : 63, "target" : 62, "value" : 6 }, { "source" : 63, "target" : 57, "value" : 2 }, { "source" : 63, "target" : 58, "value" : 4 }, { "source" : 63, "target" : 61, "value" : 3 }, { "source" : 63, "target" : 60, "value" : 2 }, { "source" : 63, "target" : 55, "value" : 1 }, { "source" : 64, "target" : 55, "value" : 5 }, { "source" : 64, "target" : 62, "value" : 12 }, { "source" : 64, "target" : 48, "value" : 5 }, { "source" : 64, "target" : 63, "value" : 4 }, { "source" : 64, "target" : 58, "value" : 10 }, { "source" : 64, "target" : 61, "value" : 6 }, { "source" : 64, "target" : 60, "value" : 2 }, { "source" : 64, "target" : 59, "value" : 9 }, { "source" : 64, "target" : 57, "value" : 1 }, { "source" : 64, "target" : 11, "value" : 1 }, { "source" : 65, "target" : 63, "value" : 5 }, { "source" : 65, "target" : 64, "value" : 7 }, { "source" : 65, "target" : 48, "value" : 3 }, { "source" : 65, "target" : 62, "value" : 5 }, { "source" : 65, "target" : 58, "value" : 5 }, { "source" : 65, "target" : 61, "value" : 5 }, { "source" : 65, "target" : 60, "value" : 2 }, { "source" : 65, "target" : 59, "value" : 5 }, { "source" : 65, "target" : 57, "value" : 1 }, { "source" : 65, "target" : 55, "value" : 2 }, { "source" : 66, "target" : 64, "value" : 3 }, { "source" : 66, "target" : 58, "value" : 3 }, { "source" : 66, "target" : 59, "value" : 1 }, { "source" : 66, "target" : 62, "value" : 2 }, { "source" : 66, "target" : 65, "value" : 2 }, { "source" : 66, "target" : 48, "value" : 1 }, { "source" : 66, "target" : 63, "value" : 1 }, { "source" : 66, "target" : 61, "value" : 1 }, { "source" : 66, "target" : 60, "value" : 1 }, { "source" : 67, "target" : 57, "value" : 3 }, { "source" : 68, "target" : 25, "value" : 5 }, { "source" : 68, "target" : 11, "value" : 1 }, { "source" : 68, "target" : 24, "value" : 1 }, { "source" : 68, "target" : 27, "value" : 1 }, { "source" : 68, "target" : 48, "value" : 1 }, { "source" : 68, "target" : 41, "value" : 1 }, { "source" : 69, "target" : 25, "value" : 6 }, { "source" : 69, "target" : 68, "value" : 6 }, { "source" : 69, "target" : 11, "value" : 1 }, { "source" : 69, "target" : 24, "value" : 1 }, { "source" : 69, "target" : 27, "value" : 2 }, { "source" : 69, "target" : 48, "value" : 1 }, { "source" : 69, "target" : 41, "value" : 1 }, { "source" : 70, "target" : 25, "value" : 4 }, { "source" : 70, "target" : 69, "value" : 4 }, { "source" : 70, "target" : 68, "value" : 4 }, { "source" : 70, "target" : 11, "value" : 1 }, { "source" : 70, "target" : 24, "value" : 1 }, { "source" : 70, "target" : 27, "value" : 1 }, { "source" : 70, "target" : 41, "value" : 1 }, { "source" : 70, "target" : 58, "value" : 1 }, { "source" : 71, "target" : 27, "value" : 1 }, { "source" : 71, "target" : 69, "value" : 2 }, { "source" : 71, "target" : 68, "value" : 2 }, { "source" : 71, "target" : 70, "value" : 2 }, { "source" : 71, "target" : 11, "value" : 1 }, { "source" : 71, "target" : 48, "value" : 1 }, { "source" : 71, "target" : 41, "value" : 1 }, { "source" : 71, "target" : 25, "value" : 1 }, { "source" : 72, "target" : 26, "value" : 2 }, { "source" : 72, "target" : 27, "value" : 1 }, { "source" : 72, "target" : 11, "value" : 1 }, { "source" : 73, "target" : 48, "value" : 2 }, { "source" : 74, "target" : 48, "value" : 2 }, { "source" : 74, "target" : 73, "value" : 3 }, { "source" : 75, "target" : 69, "value" : 3 }, { "source" : 75, "target" : 68, "value" : 3 }, { "source" : 75, "target" : 25, "value" : 3 }, { "source" : 75, "target" : 48, "value" : 1 }, { "source" : 75, "target" : 41, "value" : 1 }, { "source" : 75, "target" : 70, "value" : 1 }, { "source" : 75, "target" : 71, "value" : 1 }, { "source" : 76, "target" : 64, "value" : 1 }, { "source" : 76, "target" : 65, "value" : 1 }, { "source" : 76, "target" : 66, "value" : 1 }, { "source" : 76, "target" : 63, "value" : 1 }, { "source" : 76, "target" : 62, "value" : 1 }, { "source" : 76, "target" : 48, "value" : 1 }, { "source" : 76, "target" : 58, "value" : 1 } ] ;
var nodes = [ { "name" : "Myriel", "group" : 1 }, { "name" : "Napoleon", "group" : 1 }, { "name" : "Mlle.Baptistine", "group" : 1 }, { "name" : "Mme.Magloire", "group" : 1 }, { "name" : "CountessdeLo", "group" : 1 }, { "name" : "Geborand", "group" : 1 }, { "name" : "Champtercier", "group" : 1 }, { "name" : "Cravatte", "group" : 1 }, { "name" : "Count", "group" : 1 }, { "name" : "OldMan", "group" : 1 }, { "name" : "Labarre", "group" : 2 }, { "name" : "Valjean", "group" : 2 }, { "name" : "Marguerite", "group" : 3 }, { "name" : "Mme.deR", "group" : 2 }, { "name" : "Isabeau", "group" : 2 }, { "name" : "Gervais", "group" : 2 }, { "name" : "Tholomyes", "group" : 3 }, { "name" : "Listolier", "group" : 3 }, { "name" : "Fameuil", "group" : 3 }, { "name" : "Blacheville", "group" : 3 }, { "name" : "Favourite", "group" : 3 }, { "name" : "Dahlia", "group" : 3 }, { "name" : "Zephine", "group" : 3 }, { "name" : "Fantine", "group" : 3 }, { "name" : "Mme.Thenardier", "group" : 4 }, { "name" : "Thenardier", "group" : 4 }, { "name" : "Cosette", "group" : 5 }, { "name" : "Javert", "group" : 4 }, { "name" : "Fauchelevent", "group" : 0 }, { "name" : "Bamatabois", "group" : 2 }, { "name" : "Perpetue", "group" : 3 }, { "name" : "Simplice", "group" : 2 }, { "name" : "Scaufflaire", "group" : 2 }, { "name" : "Woman1", "group" : 2 }, { "name" : "Judge", "group" : 2 }, { "name" : "Champmathieu", "group" : 2 }, { "name" : "Brevet", "group" : 2 }, { "name" : "Chenildieu", "group" : 2 }, { "name" : "Cochepaille", "group" : 2 }, { "name" : "Pontmercy", "group" : 4 }, { "name" : "Boulatruelle", "group" : 6 }, { "name" : "Eponine", "group" : 4 }, { "name" : "Anzelma", "group" : 4 }, { "name" : "Woman2", "group" : 5 }, { "name" : "MotherInnocent", "group" : 0 }, { "name" : "Gribier", "group" : 0 }, { "name" : "Jondrette", "group" : 7 }, { "name" : "Mme.Burgon", "group" : 7 }, { "name" : "Gavroche", "group" : 8 }, { "name" : "Gillenormand", "group" : 5 }, { "name" : "Magnon", "group" : 5 }, { "name" : "Mlle.Gillenormand", "group" : 5 }, { "name" : "Mme.Pontmercy", "group" : 5 }, { "name" : "Mlle.Vaubois", "group" : 5 }, { "name" : "Lt.Gillenormand", "group" : 5 }, { "name" : "Marius", "group" : 8 }, { "name" : "BaronessT", "group" : 5 }, { "name" : "Mabeuf", "group" : 8 }, { "name" : "Enjolras", "group" : 8 }, { "name" : "Combeferre", "group" : 8 }, { "name" : "Prouvaire", "group" : 8 }, { "name" : "Feuilly", "group" : 8 }, { "name" : "Courfeyrac", "group" : 8 }, { "name" : "Bahorel", "group" : 8 }, { "name" : "Bossuet", "group" : 8 }, { "name" : "Joly", "group" : 8 }, { "name" : "Grantaire", "group" : 8 }, { "name" : "MotherPlutarch", "group" : 9 }, { "name" : "Gueulemer", "group" : 4 }, { "name" : "Babet", "group" : 4 }, { "name" : "Claquesous", "group" : 4 }, { "name" : "Montparnasse", "group" : 4 }, { "name" : "Toussaint", "group" : 5 }, { "name" : "Child1", "group" : 10 }, { "name" : "Child2", "group" : 10 }, { "name" : "Brujon", "group" : 4 }, { "name" : "Mme.Hucheloup", "group" : 8 } ] ;
var width = 550
height = 400;
var color = d3.scale.category20();
var force = d3.layout.force()
.nodes(d3.values(nodes))
.links(links)
.size([width, height])
.linkDistance(50)
.charge(-120)
.on("tick", tick)
.start();
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var link = svg.selectAll(".link")
.data(force.links())
.enter().append("line")
.attr("class", "link")
.style("stroke-width", function(d) { return Math.sqrt(d.value); });
var node = svg.selectAll(".node")
.data(force.nodes())
.enter().append("g")
.attr("class", "node")
.style("fill", function(d) { return color(d.group); })
.style("opacity", 0.9)
.on("mouseover", mouseover)
.on("mouseout", mouseout)
.call(force.drag);
node.append("circle")
.attr("r", 6)
node.append("svg:text")
.attr("class", "nodetext")
.attr("dx", 12)
.attr("dy", ".35em")
.text(function(d) { return d.name });
function tick() {
link
.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
node.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
}
function mouseover() {
d3.select(this).select("circle").transition()
.duration(750)
.attr("r", 16);
d3.select(this).select("text").transition()
.duration(750)
.attr("x", 13)
.style("stroke-width", ".5px")
.style("font", "17.5px serif")
.style("opacity", 1);
}
function mouseout() {
d3.select(this).select("circle").transition()
.duration(750)
.attr("r", 8);
}
</script>
</body>
第二个文件工作正常。但我在第一个文件中没有看到任何语法错误。事实上它们非常相似。为什么第二个不起作用？
最佳答案
links 的 source 和 target 值表示 nodes 数组中对象的索引。这些可以是字符串值或数字，但如果它们是字符串值，则节点需要具有显式的 id 属性。
您需要向每个节点添加 id 属性(如果您使用的是 D3 4.x)，或者更改 links 数组中的源/目标属性对应于每个节点索引的数字(对于 D3 3.x 或 4.x)。
例如:
var links = [
{ "source" : 0, "target" : 1, "value" : 1 },
{ "source" : 1, "target" : 2, "value" : 2 }
...
] ;
或者:
var nodes = [
{ "name" : "Myriel", "group" : 1 , id: "A"},
{ "name" : "Napoleon", "group" : 1, id: "B" }
...
];
关于javascript - 类型错误 : Cannot read property 'push' of undefined D3?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46206575/