title: Is there a simple but useful jquery.JsPlumb example?
body: <p>For the last week I've been searching for some graph-visualization javascript-library and I've stumbled upon <a href="http://jsplumb.org" rel="noreferrer">jsPlumb</a>, which is judging by the examples I've seen, the best looking and most advanced library I've seen so far. The documentation is, while being quite big, not very helpful as I cannot figure out how to actually perform the most essential tasks.</p>
  
  <p>My list of questions includes:</p>
  
  <ul>
  <li>How do I tell the graph to use predefined elements of the DOM-Tree?</li>
  <li>What part of these elements will be displayed?</li>
  <li>While making connections is easy, how do I define the alignment?</li>
  </ul>
  
  <p>While these questions remain, there are a few examples, but either they are to simple to be of any use (see example 1), or they are so complex that even retrieving(well the download isn't a problem, but I don't really want to analyse everything before playing around with some library...) the code is at least for me impossible (see <a href="https://github.com/sporritt/jsPlumb/tree/master/demo" rel="noreferrer">https://github.com/sporritt/jsPlumb/tree/master/demo</a>).</p>
  
  <p>Example 1</p>
  
  <pre><code> &lt;head&gt;
    &lt;script type="text/javascript" 
       src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"&gt;
    &lt;/script&gt;
    &lt;script type="text/javascript" 
       src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"&gt;
    &lt;/script&gt;
    &lt;script type="text/javascript" 
       src="PATH_TO/jquery.jsPlumb-1.3.15-all-min.js "&gt;
    &lt;/script&gt;
    &lt;script type="text/javascript"&gt;
       jsPlumb.bind("ready", function() {
          var e0 = jsPlumb.addEndpoint("container0"),
          e1 = jsPlumb.addEndpoint("container1");
  
          jsPlumb.connect({ source:e0, target:e1 });
       });
   &lt;/script&gt;
   &lt;/head&gt;
   &lt;body&gt;
     &lt;div id="container0"&gt;
     &lt;/div&gt;
     &lt;div id="container1"&gt;
     &lt;/div&gt;
   &lt;/body&gt;
  </code></pre>
  
  <p>Which results in
  <img src="https://i.stack.imgur.com/Toz2E.jpg" alt="Screenshot of Example 1"></p>
  
  <p>Can anyone give me an Example which answers my Questions?</p>
  
  <p>Thanks in advance.</p>