简体   繁体   中英

jsPlumb - Disable dragging for endpoints

I'm trying to render a static page to show several elements connected with Flowchart connectors.

I do not want the user to be able to drag / edit connections between elements in any way.

However, by default, endpoints do respond to mouse clicks -- they can be dragged, and even worse: the whole connection disappears after the mouse button is released.

Here's the portion of my code that creates connection between two div elements:

<div id="elema" class="elema">a test</div>
<div id="elemb" class="elemb">a really, ridiculously long test</div>

<script type="text/javascript">
    jsPlumb.ready(function() {

        jsPlumb.connect({
            source:"elema",
            target:"elemb",
            anchors: ['Right', 'Left'],
            connector: [ "Flowchart", { cornerRadius: 20 } ],
            endpoint: ["Dot", {"enabled": false}]
        });

    });
</script>

The API documentation rather clearly states that we can toggle the enabled property on Endpoints:

[enabled=true] Boolean optional

Whether or not the Endpoint should be enabled for mouse events (drag/drop).

However, this doesn't seem to do anything.

I'm very new to Javascript, so I apologize in advance if I'm missing something obvious.

PS I'm using JsPlumb 2.8.0 (Community Edition).

Found a solution.

jsPlumb.importDefaults({
        ConnectionsDetachable: false
});

Calling this before jsPlumb.connect() function disables drag events for all connections (and their respective endpoints). Crude, but since I do not need drag&drop functionality at all, this works.

actually, when I do like this, it works.

var sourceEndPoint = {
    endpoint: "Dot",
    enabled: false, // to disable dragging
    paintStyle: {
        stroke: "#9e9e9e",
        fill: "#ffffff",
        radius: 5,
        strokeWidth: 1
    },
    isSource: true,
    connector: [ "Bezier", { curviness: 50, stub: 0 } ],  
};

 instance.addEndpoint(toId.toString(), sourceEndpoint, {anchor: outAnchor, uuid:sourceUUID});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM