## Visualizing a set of Hiveplots with Neo4j

What should a graph look like and how can I tell two graphs apart?

## JUNG in Neo4j – Part 2

A few weeks ago I showed you how to visualize a graph using the chord flare visualization and how to visualize a network using a force directed graph visualization from D3.js.

This post on Graphs Beyond the Hairball by Robert Kosara explains why some non-traditional graph visualizations may work better and links us to an article explaining what a Node Quilt is and how it’s useful. We’re going to just take the first step and build a Matrix representation of a graph. We will use one of the JUNG clustering algorithms to help us understand it.

## Connections in Time

Some relationships change over time. Think about your friends from high school, college, work, the city you used to live in, the ones that liked you ex- better, etc. When exploring a social network it is important that we understand not only the strength of the relationship now, but over time. We can use communication between people as a measure.

I ran into a visualization that explored how multiple parties where connected by communications in multiple projects. We’re going to reuse it to explore how multiple people interact with each other. So let’s make a network of 50 friends and connect them to each other multiple times. Think of it as people writing on your facebook wall.

## Visualizing a Network with Cypher and D3.js

We’ve seen some pretty nice visualizations of nodes and their immediate neighbors, but we want to be able to visualize more. So we’re going to prepare a 200 node network, use Cypher to extract the data we want and visualize it with D3.js.

## Graph Visualization and Neo4j – Part Three

Like I promised in my previous post, I wanted to do a little something on D3.js.

We are going to take one of their example visualizations and visualize a follows graph.

To create our graph, we will take the names of 20 people: create nodes for them, add them to an index, and randomly link them together.

## Graph Visualization and Neo4j – Part Two

If you’re into NoSQL and Graph Databases like Neo4j, then you’ll probably tend to be working on back-end development. If you’re lucky enough to work in a team of specialists, some UX guy will come up with user requirements, hand them off to a UI gal for design, who will then pass it on to a Javascript Ninja to slice it together and they’ll just ask you provide the data and stuff it in a JSON object.

If you’re not so lucky and are working on pet projects by yourself then you’ll have to do it all. So I wanted to give you a little nudge into learning a visualization framework. Since my most popular blog post so far has been Graph Visualization and Neo4j and we’ve already seen one example that you’ll probably want to customize in your projects, we’ll stick with processing.js, and in the future I can do a little intro on D3.js, Unveil.js and maybe something a little crazier like VVVV.js.

So getting started is really easy. We’ll create an html document, add the minified processing javascript library and create a canvas element to put our visualization.

```<!DOCTYPE html>
<html>
<title>Hello World - Processing.js</title>
<script src="processing-1.3.6.min.js"></script>
<body>
<canvas data-src="helloworld.pjs"></canvas>
</body>
</html>
```

All right, let’s create the helloworld.pjs we reference as our canvas data source.