d3js large force-directed graph server side simulation

别来无恙 提交于 2019-12-11 03:14:32

问题


I am in the situation to create a force-directed graph with couple of thousands nodes.

As you may guess, the interactive simulation is slow, and the browser will be frozen,as also mentioned in other posts.

However, static force-directed graph is not enough for me, and I still need to manipulate the graph with force between nodes to have nice layout. I don't care much about smoothness of simulation. My goal is: 1. the browser will not be frozen; 2. I can drag a node from one place to another with force between nodes for each tick. And, the time interval to visualize node positions can be longer.

I was thinking about putting the node position calculation in node.js. Many articles about pre-rendering d3 graph on the server-side, but I need all simulation calculation be done on the server-side, with the interaction with front-end users. So, I probably need to register listeners to "drag", "zoom", "mouseover" actions in node.js also.

I am not sure whether there is an easy way to do this.


回答1:


How about trying one of these two options:

  1. Pre-render the force layout on the server, and on the client side, you re-run d3.layout.force(). Because the nodes will be already layed-out, it won't last long, and won't freeze the browser. Then you register the listeners you need?

  2. On the server, generate the graph with its layout and events binding, attaching it to a DOM DocumentFragment. You pass this structure to the client with your client-side javascript, and attach it to the browser DOM.



来源:https://stackoverflow.com/questions/23294600/d3js-large-force-directed-graph-server-side-simulation

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!