自动图形布局弹簧理论
问题描述:
我试图将实体视觉化以显示彼此之间的关系。它看起来像自动图形布局,弹簧算法将适合我的需要。我想用c#在Silverlight中实现它,所以我正在寻找代码示例,或链接到理论的很好的解释。任何帮助赞赏自动图形布局弹簧理论
答
我写了一些代码,前一段时间来执行动态使用C#和XNA的图形布局(可根据要求提供完整源代码)。
下面是一些关键功能:
public void UpdateNodes()
{
for (int i = 0; i < nodes.Count; i++)
{
Vector2 netForce = Vector2.Zero;
foreach (Node otherNode in nodes)
{
if (otherNode != nodes[i])
{
netForce += CoulombRepulsion(nodes[i], otherNode); //calculate repulsion for all nodes
if (nodes[i].links.Contains(otherNode))
{
netForce += HookeAttraction(nodes[i], otherNode); //only calc attraction for linked nodes
}
}
}
nodes[i].Velocity += netForce;
nodes[i].Velocity *= .99f;
nodes[i].Position += nodes[i].Velocity;
}
}
public Vector2 HookeAttraction(Node node1, Node node2) //ON node1 BY node2
{
Vector2 direction = Vector2.Subtract(node2.Position, node1.Position);
direction.Normalize();
return hookeConst* node2.Mass * Vector2.Distance(node1.Position, node2.Position) * direction;
}
public Vector2 GravAttraction(Node node1, Node node2) //ON node1 BY node2
{
Vector2 direction = Vector2.Subtract(node2.Position, node1.Position);
direction.Normalize();
return gravConst * node2.Mass * Vector2.DistanceSquared(node1.Position, node2.Position) * direction;
}
选择根据你想如何快速的图形收敛两个常量。我使用这些:
private const float hookeConst = .000005f;
private const float gravConst = .00000001f;
该代码是不言自明的,但随时问你是否需要任何东西。基本上,在一个循环中调用UpdateNodes()函数,并且您的图形将收敛于其最小能量状态。
答
我没有使用任何这些例子,但我相信他们会对你有用。
- Silverlight diagramming with spring embedder layout [demo]
- Silverlight Bag of tricks
- A Silverlight graph visualizer (updated)
也有类似的(重复?)的问题在这里:Graph visualisation in Silverlight
请注意:“节点[i] .Velocity * = .99f;”是一个让你的图更容易聚合的衰减常数。为了减少“弹性”而减少该值。 – 2009-08-25 04:43:41
我想来源... [email protected] – 2009-08-25 04:46:42
当然,这是(作为一个压缩项目):http://staff.arson-media.com/preetum/uploads/springForceV0.zip 请注意,我很早以前就编写了这个代码,所以有一些不必要的混淆区域(如更新循环中标记为“mouseStuff”的区域)。尽管如此,所有重要的组成部分都是存在的并且是功能性的。 (还有一些与鼠标的互动性) – 2009-08-25 05:22:40