diff options
| -rw-r--r-- | bubble.html | 9 | ||||
| -rw-r--r-- | bubble.js | 56 | ||||
| -rw-r--r-- | preprocess.js | 4 |
3 files changed, 34 insertions, 35 deletions
diff --git a/bubble.html b/bubble.html index 79359d6..f635c23 100644 --- a/bubble.html +++ b/bubble.html @@ -78,9 +78,6 @@ html, body { margin: 0; padding: 0; } -#infobox .user-info .relations:empty:before { - content: "(none)"; -} /* style for svg contents */ .node { stroke: #fff; @@ -128,9 +125,11 @@ html, body { <p> Tweets: <span class="tweet-count"></span>.<br> Spam: <span class="spam-status"></span>.<br> - Relations (<span class="relations-count"></span>): + Relations (<span class="relations-from-count"></span> + + <span class="relations-to-count"></span>): </p> - <ul class="relations"></ul> + <ul class="relations-from"></ul> + <ul class="relations-to"></ul> </div> </div> </div> @@ -207,7 +207,8 @@ function processData(data) { // ... and also update neighboring nodes contents.selectAll('.node') .classed('neighbor', function (node) { - return node.related.indexOf(d.index) >= 0; + return node.relatedTo.indexOf(d.index) >= 0 || + node.relatedFrom.indexOf(d.index) >= 0; }); }) .on('mouseout', function (d) { @@ -234,35 +235,33 @@ function processData(data) { userInfo.select('.spam-status') .text(d.isSpam ? 'SPAM' : 'ham'); - var selfId = d.index; - var links = []; - force.links().forEach(function (edge) { - // insert related elements, assuming no self-references - if (edge.source.index === selfId) { - links.push({ - direction: 'to', - node: edge.target + var nodes = { + 'from': force.nodes().filter(function (edge) { + return edge.relatedFrom.indexOf(d.index) >= 0; + }), + 'to': force.nodes().filter(function (edge) { + return edge.relatedTo.indexOf(d.index) >= 0; + }) + }; + Object.keys(nodes).forEach(function (dir) { + var related = nodes[dir]; + related.sort(function sort_by_name(a, b) { + return a.name.localeCompare(b.name); + }); + userInfo.select('.relations-' + dir + '-count') + .text(related.length); + var relations = userInfo.select('.relations-' + dir) + .selectAll('li') + .data(related, function key_func_links(d) { + // unique keys to group by node (index) + return d.index; }); - } else if (edge.target.index === selfId) { - links.push({ - direction: 'from', - node: edge.source + relations.enter().append('li') + .text(function (d) { + return dir + ' ' + d.name; }); - } + relations.exit().remove(); }); - userInfo.select('.relations-count') - .text(links.length); - var relations = userInfo.select('.relations') - .selectAll('li') - .data(links, function (d) { - // unique keys to group by direction and node (index) - return d.direction + ' ' + d.node.index; - }); - relations.enter().append('li') - .text(function (d) { - return d.direction + ' ' + d.node.name; - }); - relations.exit().remove(); } force.on('tick', function() { @@ -338,7 +337,8 @@ function run() { tweetCount: d.tweetcount, radius: Math.sqrt(d.tweetcount), isSpam: +d.isspam, - related: [] // nodes that link to this + // indices of nodes that link to this one + relatedTo: [], relatedFrom: [], }; }), // source,target,value diff --git a/preprocess.js b/preprocess.js index 904d6be..0bd13e5 100644 --- a/preprocess.js +++ b/preprocess.js @@ -75,7 +75,7 @@ function preprocess(data, options) { link.source = userIds_indices[link.source]; link.target = userIds_indices[link.target]; // for faster lookup, store neighboring nodes per node - data.nodes[link.source].related.push(link.target); - data.nodes[link.target].related.push(link.source); + data.nodes[link.source].relatedTo.push(link.target); + data.nodes[link.target].relatedFrom.push(link.source); }); } |