D3.js graphe orienté vers la force, réduit le croisement des arêtes en faisant en sorte que les arêtes se repoussent

Question

J'ai donc une page déjà, qui attire une force dirigée graphique, comme celui montré ici.

Et cela fonctionne bien. Je suis à l'aide de la JS à partir d' ici, avec un peu de bricolage pour étaler les nœuds un peu plus sympa.

Ceux-ci sont plus ou moins les seules différences:

d3.json("force.json", function(json) {
  var force = d3.layout.force()
      .gravity(0.1)
      .charge(-2000)
      .linkDistance(1)
      .linkStrength(0.1)
      .nodes(json.nodes)
      .links(json.links)
      .size([w, h])
      .start();

D'où la réduction de la liaison de force semble rendre les liens plus comme des ressorts, de sorte qu'il devient semblable à la Fruchterman & Reingold technique souvent utilisée. Cela fonctionne raisonnablement bien, mais seulement pour assez petits graphes. Avec de grandes graphiques, le nombre de passages à niveau va juste - comme on pouvait s'y attendre, mais la solution qu'il pose sur est normalement loin d'être optimale. Je ne suis pas à la recherche d'une méthode pour obtenir la solution optimale, je sais que c'est très difficile. Je voudrais juste avoir quelques brut de plus qui tente de forcer les lignes d'intervalle, et les nœuds.

Est-il possible d'ajouter une répulsion entre les liens, ainsi qu'entre les nœuds? Je ne suis pas familier avec la façon dont D3-d'œuvre travaille, et je n'arrive pas à trouver quelque chose qui dit que c'est possible...

Answer 1

Quelque chose qui pourrait être plus facile que d'essayer de les repousser avec force les bords de est à se déhancher les nœuds jusqu'à ce que le montant de la traversée de lignes dans le système est plus faible.

http://en.wikipedia.org/wiki/Simulated_annealing

Démarrer avec les nœuds avec le moins de connexions et de se déhancher vers le bas.

Si vous essayez d'utiliser les bords comme des nœuds, je soupçonne que vous êtes juste pour obtenir le même spatiales les problèmes de verrouillage. La solution est de trouver où il y a le bord des intersections et si elles peuvent être réglées. Vous pourriez trouver que la résolution de nombreux de bord passages n'est pas possible

Une plus approche latérale pour la visualisation consiste à animer en sorte qu'il n'affiche qu'un sous-ensemble de nœuds et de connexions à la fois. Ou pour rendre les bords transparents jusqu'à ce que l'utilisateur place des focus de la souris sur un nœud, qui pointent les associés bords deviennent plus visibles.

Answer 2

J'ai suivi l'exemple de l'éditeur de force et j'ai constaté que le réglage des valeurs charge et linkDistance résout le problème.

   ...
  .charge(-200)
  .linkDistance(50)
  ...
 

Capture d'écran: