Last active
August 29, 2015 13:58
-
-
Save g8d3/10320302 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
sigma.utils.pkg('sigma.canvas.edges'); | |
sigma.canvas.edges.t = function(edge, source, target, context, settings) { | |
var color = edge.color, | |
prefix = settings('prefix') || '', | |
edgeColor = settings('edgeColor'), | |
defaultNodeColor = settings('defaultNodeColor'), | |
defaultEdgeColor = settings('defaultEdgeColor'); | |
if (!color) | |
switch (edgeColor) { | |
case 'source': | |
color = source.color || defaultNodeColor; | |
break; | |
case 'target': | |
color = target.color || defaultNodeColor; | |
break; | |
default: | |
color = defaultEdgeColor; | |
break; | |
} | |
context.strokeStyle = color; | |
context.lineWidth = 11; | |
//context.lineWidth = edge[prefix + 'size'] || 1; | |
context.beginPath(); | |
context.moveTo( | |
source[prefix + 'x'], | |
source[prefix + 'y'] | |
); | |
context.lineTo( | |
source[prefix + 'x'], | |
target[prefix + 'y'] | |
); | |
context.lineTo( | |
target[prefix + 'x'], | |
target[prefix + 'y'] | |
); | |
context.stroke(); | |
}; | |
var s, | |
g = { | |
nodes: [], | |
edges: [] | |
}, | |
colors = { | |
starter: '#617db4', | |
commenter: '#668f3c', | |
idea: '#c6583e', | |
edge: '#b956af' | |
}; | |
getCsv('/sna.csv',function(data){ | |
//------- Node related functions -------- | |
nodes = function(type, id, label){ | |
return _nodes[type][id] || | |
(_nodes[type][id] = defaultNode(type, id, label)); | |
} | |
// _nodes['starter'][1] => {id: 1, label: 'denny'} | |
// _nodes['idea'][1] => {id: 1, label: 'ventilation advisor'} | |
_nodes = { | |
starter: {}, | |
commenter: {}, | |
idea: {} | |
}; | |
var nodeId = function(type, id){ | |
return type + '-' + id; | |
}; | |
var defaultNode = function(type, id, label, x, y, size, color){ | |
return { | |
id: nodeId(type, id), | |
label: label, | |
x: x || Math.random(), | |
y: y || Math.random(), | |
size: size || 0, | |
color: color || colors[type] | |
}; | |
}; | |
var starter = function(entry){ | |
return nodes('starter', entry.starter, entry.starter); | |
}; | |
var commenter = function(entry){ | |
return nodes('commenter', entry.commenter, entry.commenter); | |
}; | |
var idea = function(entry){ | |
return nodes('idea', entry.idea, entry.idea); | |
}; | |
//------- End node related functions -------- | |
edges = {}; | |
edgeId = function(from, to){ | |
return from + "-" + to; | |
} | |
for (var i = 0, l = data.length; i < l; i ++) { | |
var entry = data[i]; | |
var _starter = starter(entry); | |
var _commenter = commenter(entry); | |
var _idea = idea(entry); | |
_starter.size++; | |
_commenter.size++; | |
_idea.size++; | |
var permutations = [ | |
['starter', 'commenter'],['starter', 'idea'], | |
['commenter', 'idea'] | |
]; | |
for (var j = 0, l1 = permutations.length; j < l1; j ++) { | |
var from = permutations[j][0]; | |
var to = permutations[j][1]; | |
var fromId = eval("_" + from).id; | |
var toId = eval("_" + to).id; | |
edges[edgeId(fromId, toId)] = { | |
id: edgeId(fromId, toId), | |
source: fromId, | |
target: toId, | |
size: 1, | |
color: colors['edge'] | |
}; | |
} | |
} | |
g.nodes = _.values(_nodes.starter) | |
.concat(_.values(_nodes.commenter)) | |
.concat(_.values(_nodes.idea)); | |
g.edges = _.values(edges); | |
// Instanciate sigma: | |
s = new sigma({ | |
graph: g, | |
renderer: { | |
// IMPORTANT: | |
// This works only with the canvas renderer, so the | |
// renderer type set as "canvas" is necessary here. | |
container: document.getElementById('graph-container'), | |
type: 'canvas' | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment