# An Introduction to Graphviz via R. Kelly’s “Trapped in the Closet” Hip Hopera

As our world becomes more connected it has become of the utmost importance to clearly and easily visualize the structures that represent the modern digital age: the graph. Anyone involved in object oriented programming, artificial intelligence, networks, social media, or of course the fascinating field of graph theory makes heavy use of these structures. Graphs are a fertile topic that I plan to write more about, but for now we will focus on the immediately practical: the fantastic open source graph visualization toolkit Graphviz.

Let us explore some of the useful features of Graphviz and its associated description language “dot” by tracing the convoluted relationships of the characters in R. Kelly’s (currently) 23 part epic “Trapped in the Closet”.

Like every other web tutorial I will solipsistically assume you are using the same OS I am, Ubuntu. However, Graphviz should work just fine on Windows and even on your shiny Macbook. Begin by listening to “Trapped in the Closet” (many spoilers below), and installing Graphviz, if you haven’t already:

`sudo apt-get install graphviz`

At this point our hero, “Sylvester”, played by R. Kelly, is just now awaking from his slumber. To his great bewilderment, he finds he is in an unfamiliar bed, with an equally unfamiliar woman, Cathy (not Mary).  Let’s add them to the graph. Create a new file called “closet.dot” and write our two nodes. Since they have “connected”, let us define their relationship as two directed edges, denoted like so: “->”

```digraph Closet{
Sylvester -> Cathy;
Cathy -> Sylvester;
}
```

Now compile:

`dot -Tjpg closet.dot -o closet.jpg`

Note this will output a .jpg image but many other output formats are possible. Now that we have our graph, let us add enhancements as we follow the odyssey of Sylvester. Our protagonist breathlessly remembers he is married, and has committed an act of infidelity. Yet with hardly enough time to assess the situation, a new character, Cathy’s husband “Rufus” arrives home (at 7:00am, mind you) and Sylvester hides in the closet. Rufus and Cathy begin to make love, but our hero’s presence is betrayed by the ringing of his cell phone. Rufus searches intently for the intruder and eventually finds Sylvester in the closet (trapped), holding a gun. As an argument breaks out the group is interrupted by another man at the door (at the count of four). Let’s update our graph.

As R. Kelly would doubtlessly inform you, relationships are complicated. Let’s use different styles of edges to signify different relationships, and different node styles to signify men and women.

```digraph Closet{
Sylvester -> Cathy [color = red];
Cathy -> Sylvester [color = red];
Sylvester [shape = box];
Cathy -> Rufus;
Rufus -> Cathy;
Rufus [shape = box];
Chuck [shape = box];               // who is this man??
}
```

Note red edges signify infidelity. It is now revealed that Rufus and Chuck are intimately involved. Sylvester calls home and is startled to hear a man answer. Filled with double standards, he speeds to his domicile, resulting in an encounter with a police officer, who gives him a ticket. Upon arrival home he learns the man is merely his wife’s brother, Twan, who just got out of jail. A relieved Sylvester proceeds to engage in intercourse with his wife, Gwendolyn, only to discover a prophylactic on the bed. When pressed, Gwendolyn begins to discuss her high school friends Tina and Roxanne, and Cathy, who introduced her to the police officer, James, who is her secret lover. After you recover from the shock of this revelation let us continue updating our graph.

```digraph Closet{
Sylvester -> Cathy [color = red];
Cathy -> Sylvester [color = red];
Sylvester [shape = box, style = filled, color = ".6 .6 .9"];
Cathy -> Rufus;
Rufus -> Cathy;
Rufus [shape = box];
Chuck [shape = box];
Rufus -> Chuck [color = red, style = bold];
Chuck -> Rufus;
Sylvester -> Gwendolyn;
Gwendolyn -> Sylvester;
James -> Gwendolyn;
James [shape = box, style = filled, color = ".6 .6 .9"];
Gwendolyn -> James [color = red];
Gwendolyn -> Twan [style = dashed];
Twan -> Gwendolyn [style = dashed];
Twan [shape = box]
}
```

Note dashed lines represent family, and Rufus’ involvement with Chuck is bold, as he is a pastor. Also, individuals with guns are colored blue. The saga continues with James driving to Sylvester’s house, worried about Gwendolyn. The couple is now laughing hysterically at the mutually philanderous situation, which James mistakes for violence, and bursts in pointing his gun at Sylvester, who subsequently draws his own. The two wrestle for James’ gun, which unintentionally discharges, shooting Twan in the shoulder. Suddenly there is a knock at the door, which when opened reveals Rosie, the nosy neighbor with a spatula in her hand. An exhausted James who clearly has a lot of paperwork to do is invited home by his loving wife, Bridget, and leaves the premises.

```digraph Closet{
Sylvester -> Cathy [color = red];
Cathy -> Sylvester [color = red];
Sylvester [shape = box, style = filled, color = ".6 .6 .9"];
Cathy -> Rufus;
Rufus -> Cathy;
Rufus [shape = box];
Chuck [shape = box];
Rufus -> Chuck [color = red, style = bold];
Chuck -> Rufus;
Sylvester -> Gwendolyn;
Gwendolyn -> Sylvester;
James -> Gwendolyn [color = red];
James [shape = box, style = filled, color = ".6 .6 .9"];
Gwendolyn -> James [color = red];
Gwendolyn -> Twan [style = dashed];
Twan -> Gwendolyn [style = dashed];
Twan [shape = box]
James -> Twan [style = bold, color = green, label = "shot"];
James -> Bridget;
Rosie [label = "Rosie the n nosy neighbor"]
}
```

Green lines represent shootings. All is not well at James’ household. His southern wife, Bridget, seems jittery, thus despite being invited upstairs for pears, he ventures to the kitchen to enjoy some chicken. Here he notices a slice is missing from the cherry pie, while Bridget is allergic to cherries, a rather rare condition. After an exhaustive search, James discovers in his kitchen cabinet the secret lover of Bridget, a midget, named “Big Man”. James reacts violently to the discovery and Bridget, who somehow has Gwendolyn’s number, calls her and invites her to come break up the fight. Gwendolyn, Sylvester, and Twan, who is playing cards rather than seeking medical attention for his gunshot wound, travel to the abode. Upon arrival, Bridget, who now has a shotgun, reveals she is pregnant, and Big Man is the father. Furthermore, Gwendolyn telephones Cathy to tell her the events of the morning, only to realize that it was her that Sylvester had slept with the previous night. Here is the complete graph through chapter 12 of the saga, with friendships from previous chapters included.

```digraph Closet{
Sylvester -> Cathy [color = red];
Cathy -> Sylvester [color = red];
Sylvester [shape = box, style = filled, color = ".6 .6 .9"];
Cathy -> Rufus;
Rufus -> Cathy;
Rufus [shape = box];
Chuck [shape = box];
Rufus -> Chuck [color = red, style = bold];
Chuck -> Rufus;
Sylvester -> Gwendolyn;
Gwendolyn -> Sylvester;
James -> Gwendolyn [color = red];
James [shape = box, style = filled, color = ".6 .6 .9"];
Gwendolyn -> James [color = red];
Gwendolyn -> Twan [style = dashed];
Twan -> Gwendolyn [style = dashed];
Twan [shape = box]
James -> Twan [style = bold, color = green, label = "shot"];
James -> Bridget;
Bridget [shape=polygon, sides=5, peripheries=3, color=purple, style=filled];
Rosie [label = "Rosie the n nosy neighbor"]
bman -> Bridget [label = "impregnated"];
Bridget -> bman [color = red];
bman [shape = invtriangle, label = "Big Man"];
/* Friendships */
Gwendolyn -> Cathy [style=dotted];
Roxanne -> Tina [style = dotted];
Tina -> Roxanne [style = dotted];
Gwendolyn -> Roxanne [style = dotted];
Roxanne -> Gwendolyn [style = dotted];
Gwendolyn -> Tina [style = dotted];
Tina -> Gwendolyn [style = dotted];
Cathy -> Gwendolyn [style = dotted];
}
```

Note individuals that are both pregnant and holding a gun are purple pentagons. Midgets that are also strippers are inverted triangles, and friendships are represented by dotted lines. Though the story continues, we’ll stop here for now. I hope this has been an informative introduction to some of Graphviz’s basic features. For more information see the Documentaion, and please try to remain faithful to your significant others.