Speichern von Werten für die erneute Verwendung während einer Auswahl

Question

// Append circle. 
foo.append("circle") 
.attr("cx", function(d, i) { return coordinate(d, i, "x"); }) 
.attr("cy", function(d, i) { return coordinate(d, i, "y"); }) 
.attr("r", 50); 

// Append text. 
foo.append("text") 
.attr("x", function(d, i) { return coordinate(d, i, "x"); }) 
.attr("y", function(d, i) { return coordinate(d, i, "y"); }) 
.text("bar") 
.attr("transform", function(d, i) { return "rotate(" + 45 + ", " + coordinate(d, i, "x") + ", " + coordinate(d, i, "y") + ")"; }); 

// Calculate coordinate function. 
function coordinate(d, i, type) { 
    ... 
    // return an x or y coordinate 
} 

Ich habe eine Funktion, die eine Koordinate berechnet. Ich rufe es mehrmals an, um einige Elemente zu positionieren. Ich kann die Elemente in einem <g> nicht einfach enthalten und es übersetzen. Gibt es eine Möglichkeit, meine Koordinaten einmal zu erhalten, sie in eine Variable zu setzen und dann jedes Mal auf diese Variable zuzugreifen, wenn ich sie zum Positionieren eines Elements brauche. Die Koordinaten ändern sich bei jeder Iteration meines Datensatzes. Vielen Dank.

Answer 1

Die Idee besteht darin, die Daten so zu ändern, dass sie die x- und y-Koordinaten enthalten.

// after binding modify data 
 
    foo.data(function(d,i) { d.x = coordinate(d, i, "x"); 
 
          d.y = coordinate(d, i, "y"); 
 
          return d; 
 
          }); 
 

 
    // Append circle. 
 
    foo.append("circle") 
 
    .attr("cx", function(d, i) { return d.x; }) 
 
    .attr("cy", function(d, i) { return d.y; }) 
 
    .attr("r", 50); 
 

 
    // Append text. 
 
    foo.append("text") 
 
    .attr("x", function(d, i) { return d.x; }) 
 
    .attr("y", function(d, i) { return d.y; }) 
 
    .text("bar") 
 
    .attr("transform", function(d, i) { return "rotate(" + 45 + ", " + d.x + ", " + d.y + ")"; }); 
 

 
    // Calculate coordinate function. 
 
    function coordinate(d, i, type) { 
 
     ... 
 
     // return an x or y coordinate 
 
    }