jsplumb中的uuid无法正常工作

时间:2014-04-23 06:40:56

标签: jquery jsplumb

我编写了这段代码来创建端点并动态连接它们,但我无法使用uuid。 uuid不能在我的代码中工作,当我使用我的Div的id而不是uuid时,代码正在工作。我的jsplumb版本是1.5.5,

var targetOption = {  
                    anchor: "TopCenter",  
                    maxConnections: -1,  
                    isSource: false,  
                    isTarget: true,  
                    endpoint: ["Dot", { radius: 5 }],  
                    connector: ["Flowchart", { stub: 5 }],  
                    paintStyle: { 
                                 fillStyle: "black",
                                 outlineColor: "black",
                                 outlineWidth: 3 },  
                    hoverPaintStyle: { fillStyle: "green" },  
                    connectorPaintStyle: {  
                    lineWidth: 4,  
                    strokeStyle: "#61B7CF",  
                    joinstyle: "round",  
                    outlineColor: "white",  
                    outlineWidth: 2  
                    },
                    setDragAllowedWhenFull: true  
                   }
var sourceOption = {  
                   anchor: "BottomCenter",  
                   maxConnections: -1,  
                   isSource: true,  
                   isTarget: false,  
                   endpoint: ["Dot", { radius: 5 }],  
                   connector: ["Flowchart", { stub: 5 }],  
                   paintStyle: { 
                               fillStyle: "black",
                               outlineColor: "black",
                               outlineWidth: 3 },  
                   hoverPaintStyle: { fillStyle: "green" },  
                   connectorPaintStyle: {   
                   lineWidth: 4,  
                   strokeStyle: "#61B7CF",  
                   joinstyle: "round",  
                   outlineColor: "white",  
                   outlineWidth: 2  
                  },  
                  setDragAllowedWhenFull: true  
                  }
    var e0 = jsPlumb.addEndpoint("block1", { uuid: "block1_TopCenter", scope: "c" }, targetOption),
        e1 = jsPlumb.addEndpoint("block2", { uuid: "block2_BottomCenter", scope: "c" }, sourceOption);
    var firstInstance = jsPlumb.getInstance();
    var connection2block = firstInstance.connect({
                                                  uuids: ["block2_BottomCenter", "block1_TopCenter"],
                                                  detachable: true,
                                                  fireEvent: true,
                                                  scope: "c",
                                                  connector: ["Flowchart", { stub: 5 }],
                                                  endpointStyle: {
                                                  radius: 5
                                                  },
                                                  dragOptions: {
                                                  cursor: 'crosshair'
                                                  }
                                               });

1 个答案:

答案 0 :(得分:0)

我解决了!这是修改后的代码:

var connection2block = jsPlumb.connect({
                                              uuids: ["block2_BottomCenter", "block1_TopCenter"],
                                              detachable: true,
                                              fireEvent: true,
                                              scope: "c",
                                              connector: ["Flowchart", { stub: 5 }],
                                              endpointStyle: {
                                              radius: 5
                                              },
                                              dragOptions: {
                                              cursor: 'crosshair'
                                              }
                                           });