Recent Changes for "Tutorial" - Graph Exploration System (GUESS)http://guess.wikispot.org/TutorialRecent Changes of the page "Tutorial" on Graph Exploration System (GUESS).en-us Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:37:32EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p><table> <tr> <td> <span> Deletions are marked with - . </span> </td> <td> <span> Additions are marked with +. </span> </td> </tr> <tr> <td> Line 7: </td> <td> Line 7: </td> </tr> <tr> <td> - [[Image(tut1.gif)]] </td> <td> <span>+ </span>-<span>-&gt;</span> [[Image(tut1.gif)]]<span>&nbsp;&lt;--</span> </td> </tr> <tr> <td> Line 41: </td> <td> Line 41: </td> </tr> <tr> <td> - [[Image(tut2.gif)]] </td> <td> <span>+ </span>-<span>-&gt;</span> [[Image(tut2.gif)]]<span>&nbsp;&lt;--</span> </td> </tr> <tr> <td> Line 74: </td> <td> Line 74: </td> </tr> <tr> <td> - [[Image(tut3.gif)]] </td> <td> <span>+ </span>-<span>-&gt;</span> [[Image(tut3.gif)]]<span>&nbsp;&lt;--</span> </td> </tr> </table> </div> Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:36:31EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p><table> <tr> <td> <span> Deletions are marked with - . </span> </td> <td> <span> Additions are marked with +. </span> </td> </tr> <tr> <td> Line 7: </td> <td> Line 7: </td> </tr> <tr> <td> <span>-</span> [[Image(tut1.<span>jp</span>g)]] </td> <td> <span>+</span> [[Image(tut1.g<span>if</span>)]] </td> </tr> <tr> <td> Line 41: </td> <td> Line 41: </td> </tr> <tr> <td> <span>-</span> [[Image(tut2.<span>jp</span>g)]] </td> <td> <span>+</span> [[Image(tut2.g<span>if</span>)]] </td> </tr> <tr> <td> Line 74: </td> <td> Line 74: </td> </tr> <tr> <td> <span>-</span> [[Image(tut3.<span>jp</span>g)]] </td> <td> <span>+</span> [[Image(tut3.g<span>if</span>)]] </td> </tr> </table> </div> Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:36:07EytanAdarUpload of image <a href="http://guess.wikispot.org/Tutorial?action=Files&do=view&target=tut1.gif">tut1.gif</a>.Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:36:07EytanAdarImage <a href="http://guess.wikispot.org/Tutorial?action=Files&do=view&target=tut1.gif">tut1.gif</a> deleted.Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:34:57EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p>No differences found!</div> Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:34:40EytanAdarUpload of image <a href="http://guess.wikispot.org/Tutorial?action=Files&do=view&target=tut3.gif">tut3.gif</a>.Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:34:30EytanAdarUpload of image <a href="http://guess.wikispot.org/Tutorial?action=Files&do=view&target=tut2.gif">tut2.gif</a>.Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:34:21EytanAdarUpload of image <a href="http://guess.wikispot.org/Tutorial?action=Files&do=view&target=tut1.gif">tut1.gif</a>.Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:34:06EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p><table> <tr> <td> <span> Deletions are marked with - . </span> </td> <td> <span> Additions are marked with +. </span> </td> </tr> <tr> <td> Line 5: </td> <td> Line 5: </td> </tr> <tr> <td> <span>-</span> Run guess.bat and we’ll be up and running. The first thing you’ll see is a dialog asking if you want to open an existing database or load a new file. We’re going to start with a sample graph file so click the middle button (load GDF/GraphML). When the file chooser dialog comes up pick the sample.gdf file. You’ll then be asked if you want the new database to be persistent or in memory. Just make it in memory for now. This means that if you make changes GUESS will forget about it when you quit, but that’s fine for now. You should see something that looks like<span>&nbsp;Figure </span>1. </td> <td> <span>+</span> Run guess.bat and we’ll be up and running. The first thing you’ll see is a dialog asking if you want to open an existing database or load a new file. We’re going to start with a sample graph file so click the middle button (load GDF/GraphML). When the file chooser dialog comes up pick the sample.gdf file. You’ll then be asked if you want the new database to be persistent or in memory. Just make it in memory for now. This means that if you make changes GUESS will forget about it when you quit, but that’s fine for now. You should see something that looks like<span>:<br> + <br> + [[Image(tut</span>1.<span>jpg)]]</span> </td> </tr> <tr> <td> Line 37: </td> <td> Line 39: </td> </tr> <tr> <td> <span>-</span> 4. We can also do “((dept == ‘dept9’)-(dept == ‘dept9’)).color = blue” to just get intra-departmental links blue. You should see something like <span>Fi</span>gu<span>re </span>2. </td> <td> <span>+</span> 4. We can also do “((dept == ‘dept9’)-(dept == ‘dept9’)).color = blue” to just get intra-departmental links blue. You should see something like<span>:<br> +</span> <span><br> + [[Ima</span>g<span>e(t</span>u<span>t</span>2.<span>jpg)]]</span> </td> </tr> <tr> <td> Line 68: </td> <td> Line 72: </td> </tr> <tr> <td> <span>-</span> The last line translates to: iterate over all subsets in deptg, setting each one in turn to the variable d and then running the add(..) command on the legend. The add command takes a “prototype” node as input and a text string to put next to the prototype. So we’ll take the first node from each group (i.e. a sample node from the department) and add it to the legend along with that node’s department name. You’ll hopefully see something like <span>Figure 3</span> at this point. This is fairly standard Python syntax but you can get some great refresher materials on the web (see Additional Information section). </td> <td> <span>+</span> The last line translates to: iterate over all subsets in deptg, setting each one in turn to the variable d and then running the add(..) command on the legend. The add command takes a “prototype” node as input and a text string to put next to the prototype. So we’ll take the first node from each group (i.e. a sample node from the department) and add it to the legend along with that node’s department name. You’ll hopefully see something like <span>the figure below</span> at this point. This is fairly standard Python syntax but you can get some great refresher materials on the web (see Additional Information section).<span><br> + <br> + [[Image(tut3.jpg)]]</span> </td> </tr> </table> </div> Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:32:35EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p><table> <tr> <td> <span> Deletions are marked with - . </span> </td> <td> <span> Additions are marked with +. </span> </td> </tr> <tr> <td> Line 56: </td> <td> Line 56: </td> </tr> <tr> <td> <span>- </span> * {{{g.nodes.visible = 1}}}<br> <span>- </span> * {{{g.nodes.color = blue}}}<br> <span>- </span> * {{{g.edges.color = green}}}<br> <span>- </span> * For every department we can assign a random color<br> <span>- </span> * {{{colorize(dept)}}} </td> <td> <span>+</span> * {{{g.nodes.visible = 1}}}<br> <span>+</span> * {{{g.nodes.color = blue}}}<br> <span>+</span> * {{{g.edges.color = green}}}<br> <span>+</span> * For every department we can assign a random color<br> <span>+</span> * {{{colorize(dept)}}} </td> </tr> <tr> <td> Line 62: </td> <td> Line 62: </td> </tr> <tr> <td> <span>- </span> * {{{deptg = groupBy(dept)}}}<br> <span>- </span> * The variable deptg is a set of sets where each internal set is a department name. So lets create a legend for ourselves<br> <span>- </span> * {{{xy = Legend()}}}<br> <span>- </span> * What you’ll now see is a blank legend screen. We’re going to populate the legend with the first element in each of deptg’s subsets.<br> <span>- </span> * {{{for d in deptg: xy.add(d[0],d[0].dept)}}} </td> <td> <span>+</span> * {{{deptg = groupBy(dept)}}}<br> <span>+</span> * The variable deptg is a set of sets where each internal set is a department name. So lets create a legend for ourselves<br> <span>+</span> * {{{xy = Legend()}}}<br> <span>+</span> * What you’ll now see is a blank legend screen. We’re going to populate the legend with the first element in each of deptg’s subsets.<br> <span>+</span> * {{{for d in deptg: xy.add(d[0],d[0].dept)}}} </td> </tr> </table> </div> Tutorialhttp://guess.wikispot.org/Tutorial2007-08-10 22:31:43EytanAdar <div id="content" class="wikipage content"> Differences for Tutorial<p><strong></strong></p><table> <tr> <td> <span> Deletions are marked with - . </span> </td> <td> <span> Additions are marked with +. </span> </td> </tr> <tr> <td> Line 1: </td> <td> Line 1: </td> </tr> <tr> <td> </td> <td> <span>+ = Tutorial =<br> + <br> + Let’s start with a simple example. There is a sample database (sample.gdf) in the zip file. It includes about 400 nodes and 700 edges. Take a look at it to get a sense of what goes into a data definition file. But don’t get intimidated, almost none of it is required.<br> + <br> + Run guess.bat and we’ll be up and running. The first thing you’ll see is a dialog asking if you want to open an existing database or load a new file. We’re going to start with a sample graph file so click the middle button (load GDF/GraphML). When the file chooser dialog comes up pick the sample.gdf file. You’ll then be asked if you want the new database to be persistent or in memory. Just make it in memory for now. This means that if you make changes GUESS will forget about it when you quit, but that’s fine for now. You should see something that looks like Figure 1.<br> + <br> + The graph that popped up represents a corporate communication network. Each node represents an employee (with a department property), and each edge represents communication between two employees (with a frequency property on the edge indicating the number of undirected communications).<br> + <br> + First, some basics: Try moving around in this space. If you hover over a node or edge you can see some details pop up. If you click on the node it will center in the display. Clicking on an edge will bring both end points into view dynamically. Left clicking and dragging on the background will allow you to move the display around. Right clicking and moving the mouse will zoom you in and out of the display. If you hold down the shift key while left dragging on the background you’ll be able to draw a rectangle to zoom to.<br> + <br> + A new feature of GUESS is the ability to more easily move, delete, and edit nodes and edges. Notice the 5 buttons at the bottom of the screen. The first button on the left is the browsing mode which you start out in. The next two allow you to select nodes and edges respectively. The fourth is for manipulating convex hulls and the last allows you to annotate the document. If you click on the node tool you will be able to click on node will select it. You can then move the node around by dragging it around the screen or pull on the handles to change its size. By holding down shift as you click on the background you will be able to select multiple nodes at the same time and move them all at once (currently there is no way to resize all the nodes at the same time).<br> + <br> + As of the most recent version GUESS will give you a graphical console right underneath the visualization. In it you should see a prompt that looks like this “&gt;&gt;&gt;” Unlike Zoomgraph, GUESS uses a modified Jython interpreter (which in turn is based on Python). You can now write full programs in the GUESS language. If you type “2+2” it will evaluate to 4. If you type “test = 4” the newly defined test variable will be set to 4. The interpreter also understands if you want to enter longer routines or function definitions. For example, let’s say we want to define a factorial function. Start by typing “def fact(a):” and hit enter. The cursor will now change for a “&gt;&gt;&gt;” to a “...” indicating that you want to write more before the command gets evaluated/executed. Now you can start typing in the rest of your code (don’t forget that in Python white space defines code blocks so make sure to press tabs to indent). When you’re done simply hit enter on a blank line.<br> + <br> + {{{&gt;&gt;&gt; def fact(a):<br> + ... if (a == 1):<br> + ... return(1)<br> + ... else:<br> + ... return(a*fact(a-1))<br> + ...<br> + <br> + &gt;&gt;&gt; fact(5)<br> + <br> + 120}}}<br> + <br> + Through the interpreter you can also control what you see on the screen. For example type “center” and hit enter. The display will automatically center to include all the nodes (assuming you moved around in the initial layout). (note: type quit at any time to exit or just close the display window… try to avoid ctrl-c as you may corrupt your database).<br> + <br> + Nodes can either be selected by name or through a query on their properties. For example, try typing: “(node5,node6).color = red” This will make nodes 5 and 6 red. Our sample database has other properties on nodes. Specifically, nodes here have a department. So for example, “(dept == ‘dept5’).color = black” will set all the people in department 5 to a black color.<br> + <br> + Edges are accessed in a slightly different way. Edges have names that are the start and end nodes. For example, “(node67-node76).color = red” changes the edge between person 67 and 76 to red. You can also access edges by query. As mentioned earlier, edge in this case have an attribute called freq (frequency). So if we wanted to hide edges where the communication frequency was under 100 we would type: “(freq &lt; 100).visible = 0” The ‘-‘ also implies directionality. If the database indicated directions (which this one doesn’t) you could talk about: node67-&gt;node76, node67&lt;-node76, or node67&lt;-&gt;node76, node67?node76[1].<br> + <br> + The last mechanism for accessing edges is by defining node sets. Let’s say we only care about communications between dept 4 and 9.<br> + <br> + 1. Let’s hide everything: “g.nodes.visible = 0”.<br> + 2. Then show only the nodes in departments 4 or 9: “((dept == ‘dept4’) | (dept == ‘dept9’)).visible = 1”.<br> + 3. Finally, we can change the color for inter-departmental edges by typing: “((dept == ‘dept4’)-(dept ==’dept9’)).color = red” This command tells the GUESS to find all nodes in dept 4 and all nodes in department 9 and then will find all edges between them (in this case only one).<br> + 4. We can also do “((dept == ‘dept9’)-(dept == ‘dept9’)).color = blue” to just get intra-departmental links blue. You should see something like Figure 2.<br> + <br> + Because we are using a real language like Python in the background we could have made things much simpler by declaring some intermediate variables. For example, the following commands would have led to the same results:<br> + <br> + {{{g.nodes.visible = 0<br> + dept4 = (dept == ‘dept4’)<br> + dept9 = (dept == ‘dept9’)<br> + (dept4,dept9).visible = 1<br> + (dept4-dept9).color = red<br> + (dept9-dept9).color = blue<br> + }}}<br> + <br> + The GUESS system also contains a number of analysis modules to simply basic tasks (calculating graph metrics, etc.) These are described in much more detail elsewhere, but just to give you a flavor try this… First, reset the graph to its starting state. Type: ‘g.nodes.visible = 1’. Then type: ‘g.edges.color = green’ and finally ‘g.nodes.color = blue’ (you should see the same thing as what we started with). Type “density” This should calculate the density of the graph (.00827…).<br> + <br> + Other analysis modules do more interesting things. For example, colorize will color nodes and edges by different features. Try typing “colorize(dept)” Each node will now be a different (random) color. The colorize function will also generate a bunch of subgraphs. Then try “colorize(freq,blue,red)” which will assign a color over a linear range (from blue to red) based on the frequency of communications.<br> + <br> + Ok, let’s try something a little more interesting:<br> + <br> + * Lets reset everything…<br> + * {{{g.nodes.visible = 1}}}<br> + * {{{g.nodes.color = blue}}}<br> + * {{{g.edges.color = green}}}<br> + * For every department we can assign a random color<br> + * {{{colorize(dept)}}}<br> + * Lets say we want to create a legend so we can tell which color goes with each department. First thing is to get GUESS to group nodes by department for us<br> + * {{{deptg = groupBy(dept)}}}<br> + * The variable deptg is a set of sets where each internal set is a department name. So lets create a legend for ourselves<br> + * {{{xy = Legend()}}}<br> + * What you’ll now see is a blank legend screen. We’re going to populate the legend with the first element in each of deptg’s subsets.<br> + * {{{for d in deptg: xy.add(d[0],d[0].dept)}}}<br> + <br> + The last line translates to: iterate over all subsets in deptg, setting each one in turn to the variable d and then running the add(..) command on the legend. The add command takes a “prototype” node as input and a text string to put next to the prototype. So we’ll take the first node from each group (i.e. a sample node from the department) and add it to the legend along with that node’s department name. You’ll hopefully see something like Figure 3 at this point. This is fairly standard Python syntax but you can get some great refresher materials on the web (see Additional Information section).</span> </td> </tr> </table> </div>