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>
<head>
<title>Hello World - Processing.js</title>
<script src="processing-1.3.6.min.js"></script>
</head>
<body>
<canvas data-src="helloworld.pjs"></canvas>
</body>
</html>
All right, let’s create the helloworld.pjs we reference as our canvas data source.
Continue reading →