javascript - Problemas para agregar y eliminar nodos en un diseño de fuerza con d3.js
zabbix force-layout (1)
Estoy tratando de visualizar la disponibilidad del servidor (y luego otras cosas, una vez que esto funciona) obteniendo datos de la API de Zabbix. Puede ver un ejemplo de cómo los datos devueltos se parecen a [aquí] [1] en la documentación de la API de Zabbix.
Obtener los datos no es el problema, pero estoy teniendo problemas con la unión de datos de d3.js, o mejor dicho, cómo se supone que debo hacer esto.
Después de obtener los datos, obtengo una serie de servidores ordenados alfabéticamente, y quiero que aparezcan los nuevos servidores, los que se eliminaron para desaparecer y cualquier cambio en la disponibilidad (o de lo contrario, en el futuro) para reflejar con color o cualquier otra cosa podría pensar en.
El punto es que el gráfico no debe reiniciarse, solo debe actualizarse agregando o eliminando nodos.
¿Cuál es el problema con el que estoy teniendo problemas? He logrado agregar más y más nodos a la lista (nunca borrarlos), logré que se "vuelvan a dibujar" cada vez que obtengo nuevos datos, es decir, todos los nodos se vuelven a agregar y se ajustan al centro como si fueran primero hazlo cuando cargas la página.
Y el tercero que ha resultado en el bloqueo de todos los nodos en la esquina superior izquierda.
El último, que es el estado actual de mi código.
Estoy un poco seguro de lo que estoy haciendo mal en este punto, estaba mirando esto que parece ser bastante cercano a lo que necesito, sin los enlaces de todos modos (por ahora). Eso funciona bien, y he tratado de replicar ese comportamiento en mi código, sin embargo, no funciona.
Apreciaría si alguien tuviera algunos consejos para mí, eso sería increíble. He estado jugando con esto en el trabajo durante la semana pasada sin llegar mucho más lejos :)
¡Gracias!
Debido a que solo tengo acceso a Zabbix en el trabajo, realmente solo puedo probar cosas en el tiempo CET de 16-21, que es por otras 4 horas más hoy. Si alguien tiene alguna sugerencia durante la noche la probaré mañana: D
Mi código en GitHub estará en un enlace debajo de mi publicación, ya que esta falta de reputación en este sitio me ha puesto en un agujero oscuro donde solo puedo agregar dos enlaces a mi publicación.
¿Por qué no es esto global? Tengo más de 10 representantes en otros sitios SE.
Editar:
Aún teniendo problemas, cada vez que se actualizan los datos, los círculos "ingresan" como lo hacen cuando carga esto por primera vez: http://mbostock.github.com/d3/talk/20111018/collision.html No tengo idea de qué hacer ahora: /
Lo que mencionas allí es el comportamiento predeterminado de D3. Cuando agrega nodos, se insertarán en la esquina superior izquierda. Puede cambiar este comportamiento escribiendo su propio método de ubicación y configurando directamente la X y la Y de cada nodo cuando lo agrega a su gráfico dirigido por la fuerza.
El truco es aplicar este algoritmo:
1) calcule los límites de la ventana gráfica (digamos los límites de su área de dibujo - 20) y use los trucos del ejemplo de fuerza direccionada ( http://bl.ocks.org/1129492 )
2) luego para cada tic de visualización haga esto: calcule las fuerzas para mantener los nodos en la ventana gráfica
3) el algoritmo para mantener el nodo en la ventana gráfica sería algo así: para cada nodo calcule X e Y según las fuerzas que se pueden aplicar en las 4 direcciones (arriba a la izquierda, abajo a la izquierda, arriba a la derecha, abajo a la derecha) - si está más cerca de la esquina superior izquierda, entonces configurará X e Y en consecuencia ... de todos modos, no estará fuera de la pantalla ...
Otro truco sería configurar el nodo raíz en el centro (ver esta publicación: ¿Cómo configuro el nodo focal en un Gráfico de Fuerza Dirigida D3.js? ). Eso ayudaría a estabilizar tu gráfica. Otro consejo sería intentar no mezclar llamadas ajax con tus redibujados. Lo ideal sería utilizar algunas devoluciones de llamada y llamar a redibujar cuando se carguen datos, de lo contrario terminará con el código de spaghetti (no es inusual que los gráficos dirigidos a la fuerza sean mayores que 1000 líneas).
Espero eso ayude.