Centre de la force dirigée disposition après noeud racine en utilisant les tiques (retour au centre)

StackOverflow https://stackoverflow.com/questions/9362894

  •  28-10-2019
  •  | 
  •  

Question

J'expérimente avec force dirigée en utilisant la mise en page D3.js. Ce que je besoin est le centre de la mise en page par racine (ou un autre nœud sélectionné) et retourner ce noeud au centre svg (par exemple la toile) après que la fonction tique est fait (le graphique alpha est faible). C'est possible? J'ai trouvé un exemple à

http://bl.ocks.org/1080941

mais je suis incapable de faire la racine (lors de l'utilisation APLHA ou tout autre calcul de la fonction tique personnalisée) de retour de retour au centre (centre de la mise en page par ce noeud particulier).

Toute aide serait appréciée.

Était-ce utile?

La solution

En fait, je résolu ce comme ça (semblable à précédente, mais plus sophistiqué):

force.on("tick", function(e) {

     node.attr("transform", function(d) { 
         //TODO move these constants to the header section
        //center the center (root) node when graph is cooling down
        if(d.index==0){
            damper = 0.1;
            d.x = d.x + (w/2 - d.x) * (damper + 0.71) * e.alpha;
            d.y = d.y + (h/2 - d.y) * (damper + 0.71) * e.alpha;
        }
        //start is initiated when importing nodes from XML
        if(d.start === true){
            d.x = w/2;
            d.y = h/2;
            d.start = false;
        }

        r = d.name.length;
        //these setting are used for bounding box, see [http://blockses.appspot.com/1129492][1]
        d.x = Math.max(r, Math.min(w - r, d.x));
        d.y = Math.max(r, Math.min(h - r, d.y));

            return "translate("+d.x+","+d.y+")";            

     }
    );

     });   

Autres conseils

Essayez de changer le gestionnaire d'événements de force comme ceci:

force.on("tick", function(e) {
nodes[0].x = w / 2;
nodes[0].y = h / 2;

var k = 0.05 * e.alpha;
          nodes.forEach(function(o, i) {
            o.y += (nodes[0].y - o.y) * k;
            o.x += (nodes[0].x - o.x) * k;
          });

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("cx", function(d) { return d.x; })
    .attr("cy", function(d) { return d.y; });
 });
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top