使用jsPlumbs，在调整窗口大小时重绘线条？答案

【问题标题】：Using jsPlumbs, redraw the lines when resizing the window?使用jsPlumbs，在调整窗口大小时重绘线条？
【发布时间】：2013-03-24 17:52:45
【问题描述】：

我正在努力使用 jsplumbs 只是为了做一件简单的事情。我只是用一条直线连接 div，那么在调整窗口大小时如何重绘线条？所以它总是跟随 div 的中心。我可以使用 z-index 将行放在 div 下方吗？如果我必须将一个 div 与其他几个 div 连接，那么从一个 div 中绘制多条线的最佳方法是什么？

这是我目前的代码：

http://jsbin.com/esuvuw/1/edit

感谢您的帮助

【问题讨论】：

标签： jquery jsplumb

【解决方案1】：

你在这里：

  $(window).resize(function(){
      jsPlumb.repaintEverything();
  });

将此添加到您的代码中。我刚刚遇到了这个 repaintEverything() 函数并提醒了你的帖子。

http://jsbin.com/esuvuw/9/edit 表明这是有效的。

【讨论】：

有什么回应吗？有帮助吗？
+1 :D 这应该被标记为最佳答案！这对我帮助很大！
它对我有用，如果元素是可拖动的。他们走出了收容所。

【解决方案2】：

我也以这种方式更改了您的代码：

jsPlumb.bind("ready", function(connection, e) {

jsPlumb.addEndpoint('block-1', ['BottomCenter'], []);
jsPlumb.addEndpoint('block-2', [], ['BottomCenter']);
jsPlumb.draggable('block-1');
jsPlumb.draggable('block-2');
jsPlumb.connect({

   source: "block-1", 
   target: "block-2",
   connector: 'Straight'

});
});

代码并不完美。我现在没有时间 - 抱歉。但是现在，当您拖动 div，然后更改窗口大小时，一切正常。

【讨论】：

我明白了，我没有意识到我错过了要绘制的库，我认为这只是为了激活移动设备中的触摸。谢谢，您的帮助，但我不需要让我的 div “可拖动”，我只想在每次用户时重新绘制线条，调整窗口大小，因此即使 div 移动，线条也始终附加。你知道是否有重新绘制线条的功能吗？
好的。我知道。我刚刚写了我上次用 jsPlumb 使用的东西。我认为您的连接不会移动，因为它们以错误的方式连接。我认为您应该尝试创建端点并将它们连接起来。它应该工作。如果我找到一分钟，我会尝试更新我的答案。
我对触控板撒了谎。你说的对。这不是必需的。抱歉，我的源代码中总是有它，这就是为什么我认为它是必要的。很抱歉误导了你。
嗨，mbochynsky，所以我尝试了您的代码，但它与我的相同，行不跟随 div。检查一下：
jsbin.com/esuvuw/6
当你使用 jsPlumb 时，你是怎么做的？
这是我最新的代码（实际上只是稍微改变了演示）：jsfiddle.net/matbochynski/t39jz/embedded/result ...我昨天玩了你的代码以获得你想要的东西，但我无法实现它。看起来像是内容居中的问题。你确定你必须这样做（居中）吗？写这篇文章是我的一个新想法……给我 5 分钟。