jsPlumb New Connection Handler: How to get the Endpoint anchor position?

问题

Yeah, so I've been playing with jsPlumb. Let's say I have a div with two endpoints; one TopCenter, one BottomCenter.

When a new connection is created, I can bind to that event with the function below. My question is, how do I get the anchor position for the endpoints? I do get the Source and TargetEndpoint objects, but looking at the documentation, I don't see a way to get the anchor position...

thanks!

jsPlumb.bind("jsPlumbConnection", function(connectionInfo) {
 /*
                         connection         :   the new Connection.  you can register listeners on this etc.
                        sourceId        :   id of the source element in the Connection
                          targetId      :   id of the target element in the Connection
                          source        :   the source element in the Connection
                          target        :   the target element in the Connection
                          sourceEndpoint    :   the source Endpoint in the Connection
                          targetEndpoint    :   the targetEndpoint in the Connection
                          */
});

回答1:

connectionInfo.connection.endpoints[0].anchor.type is the source position. connectionInfo.connection.endpoints[1].anchor.type is the target position.

回答2:

I found the following solution to the problem: console.log('anchors: %o %o',connectionInfo.sourceEndpoint.anchor.x, connectionInfo.sourceEndpoint.anchor.y);

By getting the x and y coordinates of the endpoints I know the position of the anchor and can use that to recreate a diagram.

来源：https://stackoverflow.com/questions/14665304/jsplumb-new-connection-handler-how-to-get-the-endpoint-anchor-position