jsPlumb在放大和缩小时的连接问题

connections issue with jsPlumb on zoom in and out

本文关键字：连接 问题 小时 缩小 放大 jsPlumb      更新时间：2023-09-26

首先，我要感谢Simon提供的这个令人惊叹的插件，我一直在为我的一个项目使用它，它看起来很神奇，我想为我的项目添加一个缩放功能，但最终导致了连接和位置的丢失，我读到一篇旧的帖子，其中说使用1px的Anchors会忽略这个问题，但它也没有解决我的问题，请看一下下面我用来处理缩放的代码，让我知道你的想法，

$("#main").css({
"-webkit-transform":"scale("0.75")",
"-moz-transform":"scale("0.75")",
"-ms-transform":"scale("0.75")",
"-o-transform":"scale("0.75")",
"transform":"scale("0.75")",
});
instance.setZoom(0.75);
<div id="main" style="float:right; background:url(images/white.gif);">
<div class="demo flowchart-demo" id="flowchart-demo" style="width:15000px; height:8125px; background:url(images/grid.png);">
  <div class="start dragwindow box" id="flowchartWindow1" style="left:42px; top: 46px;">    </div>
<div class="start dragwindow box" id="flowchartWindow2" style="left:82px; top: 86px;">    </div>
<div class="start dragwindow box" id="flowchartWindow3" style="left:102px; top: 106px;">    </div>
<div class="start dragwindow box" id="flowchartWindow4" style="left:152px; top: 156px;">    </div>
</div>
</div>

感谢

我通过在setZoom之后调用instance.repaintEverything()解决了这个问题。这当然不是最佳性能，但在我的情况下，这已经足够了。

相关文章：