Basit ama kullanışlı bir jquery.JsPlumb örneği var mı?

Geçen hafta için bazı grafik görselleştirme javascript-library arayışında bulundum ve gördüğüm örneklerle yargılandığım jsPlumb'u gördüm, bu yüzden gördüğüm en iyi ve en gelişmiş kitaplık uzak. Dokümantasyon, oldukça büyük olmakla birlikte, en temel görevleri gerçekte nasıl gerçekleştireceğimi anlayamadığımdan çok yararlı değildir.Basit ama kullanışlı bir jquery.JsPlumb örneği var mı?

soruların listem içerir:

nasıl DOM-Tree önceden tanımlanmış unsurları kullanmak için grafiği anlatır?
Bu öğelerin hangi kısımları görüntülenecek?
Bağlantıları kolaylaştırırken, hizalamayı nasıl tanımlarım?

Bu sorular devam ederken, birkaç örnek vardır, ya da bunların herhangi bir kullanımda olması basittir (bkz. Örnek 1), veya çok karmaşıktırlar. problem, ama ben gerçekten bir kütüphane ile oynamadan önce her şeyi analiz etmek istemiyorum ...) kod benim için en azından imkansız (bkz. https://github.com/sporritt/jsPlumb/tree/master/demo).

kimse bana Sorular cevaplar bir örnek verebilir Screenshot of Example 1

sonuçlanır Örnek 1

<head> 
    <script type="text/javascript" 
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"> 
    </script> 
    <script type="text/javascript" 
    src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"> 
    </script> 
    <script type="text/javascript" 
    src="PATH_TO/jquery.jsPlumb-1.3.15-all-min.js "> 
    </script> 
    <script type="text/javascript"> 
    jsPlumb.bind("ready", function() { 
     var e0 = jsPlumb.addEndpoint("container0"), 
     e1 = jsPlumb.addEndpoint("container1"); 

     jsPlumb.connect({ source:e0, target:e1 }); 
    }); 
</script> 
</head> 
<body> 
    <div id="container0"> 
    </div> 
    <div id="container1"> 
    </div> 
</body>

Şimdiden teşekkürler.

kaynak

2012-10-22 Sebastian van Wickern

deneyin ... sadece head kapanış etiketinden önce bu ekleme

<style type="text/css"> 
    #container0, #container1 { 
     float: left; 
     height: 100px; 
     width: 100px; 
     border: 1px solid black; 
     margin: 10px; 
    } 
</style>

kaynak

2012-12-12 00:27:54 spadelives

Orada sahip olduğunuz şeylerle ilgili yanlış bir şey yok, ancak boşluklarınızın stilleri yok ve konumlandırılmadı.

Onları mutlak bir şekilde konumlandırmanızı öneririm, her birine bir üst/sol ve belki bir kenarlık verin ve biraz daha yararlı bir şey görürsünüz.

kaynak

2012-10-23 05:39:54 StackOverflowResponder

Basit ama kullanışlı bir jquery.JsPlumb örneği var mı?

cevap

İlgili konular