jsPlumb: como fazer conectores de fluxograma evitar elementos de interseção?

Question

May 16, 2012, 05:39 PM

jsPlumb: como fazer conectores de fluxograma evitar elementos de interseção?

É possível tornar os conectores do Fluxograma jsPlumb não para cruzar itens conectáveis ou elementos especificados (no exemplo: elementos com a classe 'item')?

Comportamento do Fluxograma Padrão:

Um resultado desejado:

Aqui está o que eu tentei:

http://jsfiddle.net/CcfTD/1/

Editado para esclarecerHTML

 <div id="root">
        <div class="item" id="item1">Item 1</div>
        <div class="item" id="item2">Item 2</div>
        <div class="item" id="item3">Item 3</div>
        <div class="item" id="item4">Item 4</div>
        <div class="item" id="item5">Item 5</div>
  </div>

JS

   jsPlumb.connect({
    source: $('#item2'),
    target: $('#item7'),
    anchors: [ "Continuous" ],
    connector:[ "Flowchart" ],
    paintStyle: {
        strokeStyle: "#000000", 
        lineWidth:1
    }
});

Basicamente, para que o mecanismo jsPlumb (SVG ou canvas) esteja ciente dos elementos DOM relevantes e tenha um esquema de prevenção de objetos

http://jsfiddle.net/adardesign/2ZFFc/