Czy istnieje prosty, ale użyteczny przykład jquery.JsPlumb?

Przez ostatni tydzień szukałem biblioteki javascript z wizualizacją grafów i natknąłem się na jsPlumb, co wynika z przykładów, które widziałem, najlepiej wyglądającej i najbardziej zaawansowanej biblioteki, jaką widziałem. daleko. Dokumentacja jest, choć jest dość duża, niezbyt pomocna, ponieważ nie mogę wymyślić, jak właściwie wykonywać najważniejsze zadania.Czy istnieje prosty, ale użyteczny przykład jquery.JsPlumb?

Moja lista pytań obejmuje:

Jak mogę powiedzieć wykres, aby korzystając z gotowych elementów DOM-Tree?
Jaka część tych elementów będzie wyświetlana?
Podczas nawiązywania połączeń jest łatwe, jak zdefiniować wyrównanie?

Chociaż te pytania pozostają, istnieje kilka przykładów, ale obaj mają proste, aby być dowolnego zastosowania (patrz przykład 1), albo są tak skomplikowane, że nawet pobierania (również pobieranie nie jest problem, ale tak naprawdę nie chcę analizować wszystkiego przed zabawą z jakąś biblioteką ...) kod jest przynajmniej dla mnie niemożliwy (patrz https://github.com/sporritt/jsPlumb/tree/master/demo).

Przykład 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>

co skutkuje Screenshot of Example 1

Czy ktoś może mi dać przykład, który odpowiada na moje pytania?

Z góry dziękuję.

Źródło

2012-10-22 Sebastian van Wickern

Spróbuj dodać ten tuż przed zamykającym tagiem head ...

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

Źródło

2012-12-12 00:27:54 spadelives

Nie ma nic złego w tym, co masz tam, ale twoi div nie mają stylizacji i nie są pozycjonowani.

Sugerowałbym pozycjonowanie ich absolutnie, dać im każdą górę/lewo, a może granicę, a zobaczysz coś bardziej użytecznego.

Źródło

2012-10-23 05:39:54 StackOverflowResponder

Czy istnieje prosty, ale użyteczny przykład jquery.JsPlumb?

Odpowiedz

Powiązane problemy