2

フラット サークル パック レイアウトをさまざまな 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; })
      });
}
4

1 に答える 1