javascript中的网络图，单独使用jQuery可能吗？

Question

我需要在javascript中实现特定的网络图。我看过InfoVis Toolkit和Protovis，但我必须为它们实现自定义布局和许多自定义代码。我不确定它们会增加多少价值。这个小部件需要非常高效，因为它会出现在许多高度访问的网页上，我不希望小部件放慢速度。

此图表的节点富含html。下拉列表，输入元素，弹出窗口等等。因此div对每个节点都有很大的意义。我可以使用AJAX在javascript中创建div来从我的服务器读取数据。在javascript中实现布局机制，并在通过jQuery添加/更新/删除节点时为所有内容设置动画。

我能想到的唯一阻止我只使用jQuery的是节点之间的连接。我该如何绘制它们？我或许可以在节点下面使用Raphael之类的东西，并在节点位置和Raphael之间进行协调，但是在简单地看一下拉斐尔后，它看起来很棘手。

是否有另一种更简单的方法来绘制节点之间的连接？ IE支持至少对IE8很重要。优选地，线可以是弯曲的和图案化的（虚线，双线等）以表示不同类型的连接。

更新 ：我不介意购买解决方案，例如建议的mxGraph。到目前为止，只存在于解决方案中的解决方案是创建各种连接的透明PNG图像。由于我的情况中的节点在某种程度上是网格，因此存在最大数量的不同连接图像（尽管会非常大），并且由于它们是透明的，因此它们可以彼此叠加。有意义吗？

Answer 1

这正是mxGraph的目的（我在产品上工作），但问题是您是否需要开源解决方案。如果是预期用途，mxGraph可以在免费学术许可下使用。

Answer 2

您可以使用RaphaelJS执行整个图形，而不是尝试与它进行连接，这应该比仅仅用于连接的 lot 更简单。一些演示与您描述的类似（但是，演示，很多更简单）。 This one显示拖动节点，其连接保持连接。 This one显示鼠标悬停集成。看起来不像任何主要演示功能显示弹出窗口响应点击，但概念就在那里。

Raphael对象是DOM元素，因此为你的行为添加处理程序没有问题（例如，点击其中一个节点会显示一个菜单，那种事情），事实上Raphael {{ 3}}用于执行跨浏览器。