画线连接 div答案

【问题标题】：Draw lines to connect divs画线连接 div
【发布时间】：2012-08-21 03:51:04
【问题描述】：

它们是可拖动的，我正在尝试找到一种方法让线条将它们连接起来，即使它们被拖动也是如此。有一个简单的方法来展示每个是如何相关的以及应该连接哪些是理想的！

谢谢！！！

【问题讨论】：

【解决方案1】：

您应该考虑使用D3.js library。特别是这个例子是我认为你正在寻找的：http://mbostock.github.com/d3/ex/force.html

【讨论】：

【解决方案2】：

看看这个：jQuery - use canvas to draw lines between divs

我将从该代码开始，每次divs 更改位置时重新绘制线条。

【讨论】：

好吧，我只是看了看，似乎重绘可以通过在 javascript 中调用 redrawCanvas() 来实现
抱歉，我该如何实现该命令？还在学习 :) 谢谢！！
您可能想阅读 this page 的事件。它应该解释如何在浏览器中发生某些事情时运行 javascript 代码。我不确定你想使用什么事件...
我发现 jQuery 下的拖动事件可拖动，但不知道如何将其合并到您在答案中链接的代码中。docs.jquery.com/UI/Draggable#event-drag
试试$( "canvas" ).bind( "drag", function(event, ui) { redrawCanvas(); });不要忘记包含jQuery库，如果页面上有多个画布，请将"canvas"更改为更具体的内容，即："canvas#linecanvas"，这将匹配 ID 为“linecanvas”的所有画布

【解决方案3】：

你也可以试试 KineticJS。我认为它会很容易地提供你想要的东西。 http://www.kineticjs.com/

【讨论】：

【解决方案4】：

您也可以尝试jsPlumb，这是一个可以将 div 连接在一起的 JavaScript 库。它使用起来非常简单，并且该页面上有很多演示。

【讨论】：