镇静力布局的初始滴答 [英] Calm down initial tick of a force layout

问题描述

我刚刚开始使用d3，并发现学习曲线相当陡峭。这个过程是完全不同于我习惯，数学大多是在我的头。

无论如何，我的项目包含一个强制布局，表示系统之间的集成映射。这部分工作非常好，但我有一个主要关注，这也是在Michael Bostocks网站的力导向布局演示中表示的：
当节点被启动时，它们似乎是从canvas上提取的。在这之后，一些严重的物理数学正在接管，模拟一个重力拉，发送节点在一个相当混乱的路径来回，直到他们平静下来，并在一些随机坐标。虽然这些运动是第一次演示运行，当你试图查看网络接口的状态从一个公司，管理员的观点和服务器只是不会保持静止，一段时间后烦恼。 p>

我相信我有正确的布局设置为这个项目，因为我想要服务器自动布局，我想要可视化之间的链接。然而，我对于引力效应是矛盾的。

我不知道;是否可以手动设置每个节点的初始位置，以便我可以将它们靠近重力中心并缩短反弹时间？

解决方案

以上所有答案都误解了ØysteinAmundsen的问题。

只有方法来稳定力开始它是设置node.x和node.ya适当的值。
请注意，节点是d3.js的数据，而不是表示的DOM类型。

例如，如果加载

  nodes = [{id：a}，{id：b}，{id：c}] 
  

到

  d3 .layout.force（）。nodes（nodes）
  

您必须设置所有.x和.y

  nodes = [{id
 ：a，{id：b}，{id：c}] 
 for i in [0..2] 
 nodes [i] .x = 500＃节点的位置
 nodes [i] .y = 300＃节点的初始y位置
 d3.layout.force（）。nodes（nodes）.links（links）
  

那么节点将在force.start（）的位置开始。
这将避免混乱。

I've just started dabbling with d3, and find the learning curve quite steep. The process is completely different than what I am used to, and the mathematics are mostly way over my head.

Anyway, my project consists of a force layout representing map of integrations between systems. This part works out awesomely well, but I do have one major concern, which is also represented in the force directed layout demo on Michael Bostocks site: When nodes are initiated, they seem to be rendered off canvas. After this, some serious physics math is taking over, simulating a gravitational pull which sends the nodes on a rather confusing path back and forth until they calm down and settle on some random coordinates. Although these movements are ripping cool the first time the demo is run, when you are trying to view the status of network interfaces from a company it admins point of view and the servers just wont stay still, it gets tiresome after a while.

I am sure I have the correct layout setup for this project, because I do want the servers to autolayout, I do want to visualize links between them. I am however ambivalent in regards to the gravitation effect.

I wonder; is it possible to set the initial position of each node manually, so that I can put them closer to the gravitational center and shorten the "bounce time" a bit?

解决方案

All the answers above misunderstood Øystein Amundsen's question.

The only way to stabilize the force upon it starts is to set node.x and node.y a proper value. Please note that the node is the data of d3.js, not the represented DOM type.

For example, if you load

nodes = [{"id": a}, {"id": b}, {"id": c}]

into

d3.layout.force().nodes(nodes)

you have to set all .x and .y of all elements in array of nodes it will be like this ( in coffeescript )

nodes = [{"id": a}, {"id": b}, {"id": c}]
for i in [0..2]
  nodes[i].x = 500 #the initial x position of node
  nodes[i].y = 300 #the initial y position of node
d3.layout.force().nodes(nodes).links(links)

then the nodes will start at the position when force.start(). this would avoid the chaos.

这篇关于镇静力布局的初始滴答的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！