tutorial graphs force ejemplos directed javascript d3.js visualization force-layout

javascript - force - graphs d3



D3.js Force Layout: muestra solo una parte de un gráfico (2)

Esto no está implementado en D3, y no conozco ningún ejemplo. Lo que tendrías que hacer es lo siguiente:

  • Establezca el atributo fixed del nuevo nodo central en verdadero para evitar que el diseño de la fuerza cambie su posición.
  • Establezca los atributos px y py de ese mismo nodo en la posición central.
  • Para cada nodo en su diseño de fuerza, calcule la ruta más corta al nuevo nodo central.
  • Dependiendo de la longitud de la ruta en cada caso, elimine el nodo o consérvelo.

La parte más difícil aquí es el cálculo de la ruta desde cada nodo hasta el nuevo centro, pero incluso este es un problema algorítmico bastante estándar. Otra cosa a tener en cuenta es que debe modificar las estructuras de datos que contienen los nodos y los enlaces del diseño de la fuerza en su lugar, es decir, no puede establecer nuevos nodos y enlaces para el diseño de fuerzas y esperar que todo funcione sin problemas.

Buenos días,

acaba de comenzar con la impresionante biblioteca d3js ...

Quiero mostrar solo una parte de un gráfico con el diseño de fuerza dirigida. La idea es tener un nodo declarado como el "centro" y mostrar todos los nodos a una distancia de dos (por ejemplo) de este nodo central, los vecinos del nodo central y los vecinos de los vecinos. Si el usuario hace clic en uno de los nodos mostrados, se convierte en el "nuevo" nodo central y aparece un "subgrafo" diferente. Me pregunto si hay un ejemplo en cuanto a la implementación de este tipo de diseño subgráfico y si algún tipo de algoritmo de "distancia de nodos" ya está implementado en d3js.

Muchas gracias

martín

ACTUALIZACIÓN: Acabo de encontrar el ejemplo Modificación de un Diseño de Fuerza que ilumina cómo agregar y eliminar nodos y bordes de un diseño dirigido por la fuerza.


Acabo de subir una "prueba de nivel de concepto" de un subgrafo de fuerza interactiva.

http://justdharma.com/d3/sub-graph/

En este ejemplo, uso backbonejs debajo del capó. Siendo la primera vez que implemento algo con backbonejs, de seguro lo uso de una manera muy cruda. Si bien este ejemplo podría iluminar una forma de cómo se puede lograr una sub-gráfica interactiva, es seguro que no es una plantilla de cómo hacerlo, como se acaba de decir, un truco de prueba de concepto ...