フラット サークル パック レイアウトをさまざまな json ファイルのデータで更新しようとしています。このチュートリアルのコードを自分のコードで動作するように調整しました: JSON 呼び出しからのパック レイアウトのデータの更新と再描画
「要素を検査」すると、データが更新されていることが示されますが、ノードはまだ最初の JSON ファイルに関連付けられています。「currentJson」ではなく「currentUrl」をコールバックするd3.jsonに関係していると感じています。どんな助けでも大歓迎です!!
これは私のgeneratenewdataコードです:
var refresh = function() {
d3.json(currentUrl, function(error, root){
var node = svg.selectAll(".node")
.data(bubble.nodes(classes(root))
.filter(function(d){ return !d.children; }));
node.enter().append("g")
.attr("class", "node")
.on("click", getNewData)
.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
node.exit().remove();
node.append("circle")
.attr("r", 0)
.on("click", getNewData)
.transition()
.duration(2000)
.style("fill", function(d) { return color(d.packageName); })
.attr("r", function(d) { return d.r; });
node.append("title")
.text(function(d) {return "Census Tract " + d.className + " : " + format(d.value) + " " + d.packageName ; });
node.append("text")
.style("fill", "#8fb4ae")
.on("click", getNewData)
.transition()
.duration(2000)
.attr("dy", ".3em")
.style("text-anchor", "middle")
.style("fill", "#000000")
.text(function(d) { return d.className.substring(0, d.r/3); });
node.append("text")
.style("fill", "#8fb4ae")
.on("click", getNewData)
.transition()
.duration(2000)
.attr("y", 500)
.attr("x", 800)
.attr("class", "year label")
.style("fill", "#000000")
.text(function(d) { if ( !d.children) {return d.name ; } else { return ("hi") ; }; });
node.transition()
.duration(2000)
.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
node.select("circle")
.attr("r", 0)
.on("click", getNewData)
.transition()
.duration(2000)
.style("fill", function(d) { return color(d.packageName); })
.attr("r", function(d) { return d.r; })
});
}