An embeddable webGL graph visualization library. http://patrickfuller.github.io/jgraph/
The IPython notebook is an open-source tool poised to replace MATLAB in many applications. As a scientist of sorts, I'm all about it. Therefore, I made handles to use jgraph with the notebook. Install through pip:
pip install jgraph Open a new notebook and test the setup by typing:
importjgraphjgraph.draw([(1, 2), (2, 3), (3, 4), (4, 1), (4, 5), (5, 2)])into a notebook cell. You should get a paddlewheel graph as an output. You can use this in conjunction with other code for educational purposes (try generating a red-black tree!). There are three commands and some optional parameters to check out. Read the docstrings and check out the associated example for more.
You can install through npm:
npm install jgraph Once installed, you can use with:
jgraph.create('my-selector');jgraph.draw(myGraph);where 'my-selector' is where you want to place jgraph, and myGraph is a javascript object. See below for more on the object structure, or just check out the included example. The jgraph.create() method takes a few optional parameters, specifying the sizes and colors of nodes, as well as force-directed optimization.
options={directed: true,// Toggles edge arrowsnodeSize: 2.0,// Default node sizeedgeSize: 0.25,// Edge connection diameterarrowSize: 1.0,// If drawn, edge arrow sizedefaultNodeColor: 0xaaaaaa,// Color for nodes without a "color" propertydefaultEdgeColor: 0x777777,// Color for edges without a "color" propertyshader: "toon",// three.js shader to use, can be "toon", "basic", "phong", or "lambert"runOptimization: true// Runs a force-directed-layout algorithm on the graph};jgraph takes input graph data structures as plain objects. Here's the most boring graph in the world:
{nodes: {jane: {},bob: {},mike: {},sally: {}},edges: [{source: "jane",target: "bob"},{source: "bob",target: "mike"},{source: "mike",target: "sally"}]}Nodes require no information outside of their keys. However, there are useful optional parameters that can be specified.
{color: 0xffffff,// Color for this nodesize: 1.0,// Scaling factor for this node's sizelocation: [0.0,0.0,0.0]// Starting location of node. Useful for pre-rendering.}By default, the algorithm runs a force-directed layout on the graph. When enabled, the "location" field is optional. However, for larger graphs, you will want to disable this feature and pre-render the locations. Use the associated Python library (jgraph.generate) to do so.