Question

我有一个带有jsPlumb的动态生成流程图。我将它保存到MySQL数据库，我需要一个不同的视图，没有任何编辑功能。

我知道如何删除所有部分以使其无法编辑但它始终显示连接点（左，右，上，下）

如何让它们不可见，以便我只看到没有连接点的连接器/箭头？

sourceEndpoint = {
    endpoint:["Rectangle",{ width:1, height:1}],
    paintStyle:{ 
        fillStyle:"#db0013",
    },
    maxConnections:999,     
    isSource:false,
    isTarget:false,         
    connector:[ "Flowchart", { stub:[10, 25], gap:0, cornerRadius:0, alwaysRespectStubs:false } ],                                              
    connectorStyle:connectorPaintStyle,
    hoverPaintStyle:endpointHoverStyle,
    connectorHoverStyle:connectorHoverStyle,
    dragOptions:{}       
    },

宽度和高度= 1的矩形使它非常小，但仍然可见我怎么能让它成为隐形？：）

thx so fa

xQp

Answer 1

由于没有获取所有端点的函数，因此您需要获取具有端点的所有元素，然后对于单个元素的每个端点，您需要将其设置为可见为false：

var elem = $('.havingEndpoint'); // get elements having endpoint based on its class

for(var i=0;i<elem.length;i++)   // for all elements having endpoints iterate
{
     var eps=jsPlumb.getEndpoints($(elem[i]));  //get all endpoints of element
     for(var j=0;j<eps.length;j++)
     {
          eps[j].setVisible(false);   // Set visibility of endpoint to false
     }
 }

有关更多信息，请参阅API DOC＆＃39; S：

- ＆GT; Getting endpoints for an element

- ＆GT; Setting visibility for endpoint

Answer 2

还有两种方式：

使用空白端点类型。 It does not draw anything visible to the user.

将cssClass添加到sourceEndpoint选项

sourceEndpoint = {
... other options ...
    cssClass: 'source-endpoint'
}

和css风格

.source-endpoint svg * {
    fill: transparent;
    stroke: transparent;
}

Answer 3

在当前版本中，有用于连接和端点的选择方法，

，返回值是一个支持大多数操作的对象您可以在端点上执行

在此处查看文档：{{3}}

示例，隐藏所有端点：

jsPlumb.selectEndpoints().setVisible(false);

Answer 4

on http://www.jsplumb.org/doc/endpoints.html我注意到你可以将css添加到端点。你不能只使用css＆＃34; display：none＆＃34;？

jsPlumb Endpoint可见：false？

4 个答案: