Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Since the jsPlumb documentation is imho a mess, I'm kinda surprised that this kind of question doesn't come up more often within stackoverflow. Here is what was amiss:</p> <p>paintStyle.fillStyle doesn't seem to be around anymore... non of the demos use it, but the documentation still referes to it whenever paintStyle is defined within a connect-call. Strange, but strokeStyle does the job perfectly.</p> <pre><code> paintStyle: { strokeStyle: "#5b9ada", lineWidth: 3 }, </code></pre> <p>What I would suggest beyond that (even though if you change that line, everything will work) is to call jsPlumb on jsPlumb.ready</p> <pre><code> jsPlumb.bind("ready", function() { // your connection code here... }); </code></pre> <p>See the updated fiddle: <a href="http://jsfiddle.net/p42Zr/5/">http://jsfiddle.net/p42Zr/5/</a></p> <p>EDIT:</p> <p>The question was changed between loading the page and my answer, which i didn't notice. The answer up until here deals with the ORIGINAL. </p> <p>The problem with the other fiddle is a bit different, what happens is that jsPlumb creates new Endpoints on top of the already defined ones. There are two ways of changing that. Retrieve the endpoints from <code>var myendpoint = jsPlumb.addEndpoint( ... )</code> and use this variable later on to connect them. The easier way in this case though is to add <code>endpoint: ["Blank"]</code> to the options. <strong>(EDIT)</strong> Setting the endpoint-Style to "Blank" means no endpoints will be drawn, which results in a connection and the two previously defined endpoints as wanted <strong>(/EDIT)</strong>. See the updated fiddle: <a href="http://jsfiddle.net/XbcZv/1/">http://jsfiddle.net/XbcZv/1/</a></p> <p><strong>EDIT</strong> To answer a question which came up in the comments: How can I show the pointer-cursor on the connections? </p> <p>Simply add:</p> <pre><code>._jsPlumb_connector { cursor: pointer; } </code></pre> <p><strong>/EDIT</strong> to your css. For css changes on Endpoints edit the css class _jsPlumb_endpoint.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload