Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fixed remaining bug in xgmml export and optimized svg export
  • Loading branch information
proost committed Jan 8, 2016
1 parent b6a473a commit 554ca84
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 67 deletions.
13 changes: 1 addition & 12 deletions planet/static/js/planet_graph.js
View file
Expand Up @@ -309,19 +309,8 @@ $('#cy-download-xgmml').click(function(ev) {

$('#cy-download-svg').click(function(ev) {
ev.preventDefault();
var eles = cy.elements();

eles.each( function(i, ele) {
if (ele.isNode()) {
ele.data('current_color', ele.renderedStyle('background-color'));
ele.data('current_shape', ele.renderedStyle('shape'));
} else if (ele.isEdge()) {
ele.data('current_color', ele.renderedStyle('line-color'));
ele.data('current_width', ele.renderedStyle('width'));
}
});

svg = writeSVG(cy.json());
svg = writeSVG(cy);

var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(svg));
Expand Down
97 changes: 47 additions & 50 deletions planet/static/js/planet_svg.js
View file
Expand Up @@ -34,20 +34,19 @@ function writeSVG(data) {
var margin = 100;

var node_positions = new Array();
data.elements.nodes.forEach( function(node) {
data.nodes().forEach( function(node) {
node_positions[node.data('id')] = new Array();
node_positions[node.data('id')]["x"] = node.position('x');
node_positions[node.data('id')]["y"] = node.position('y');

node_positions[node.data.id] = new Array();
node_positions[node.data.id]["x"] = node.position.x;
node_positions[node.data.id]["y"] = node.position.y;

if (node.position.x > max_x) { max_x = node.position.x}
if (node.position.y > max_y) { max_y = node.position.y}
if (node.position('x') > max_x) { max_x = node.position('x')}
if (node.position('y') > max_y) { max_y = node.position('y')}

if (min_x === null) {min_x = node.position.x;}
if (min_y === null) {min_y = node.position.y;}
if (min_x === null) {min_x = node.position('x');}
if (min_y === null) {min_y = node.position('y');}

if (node.position.x < min_x) { min_x = node.position.x}
if (node.position.y < min_y) { min_y = node.position.y}
if (node.position('x') < min_x) { min_x = node.position('x')}
if (node.position('y') < min_y) { min_y = node.position('y')}

});

Expand All @@ -64,58 +63,56 @@ function writeSVG(data) {

var network = svg.g().transform('translate', (-min_x)+margin, (-min_y)+margin);

data.elements.edges.forEach( function(edge) {
if (edge.data.homology)
data.edges().forEach( function(edge) {
if (edge.data('homology'))
{
network.line({ x1:node_positions[edge.data.source]["x"],
y1:node_positions[edge.data.source]["y"],
x2:node_positions[edge.data.target]["x"],
y2:node_positions[edge.data.target]["y"],
stroke: __convertColor(edge.data.current_color),
'stroke-width': edge.data.current_width.replace('px', ''),
network.line({ x1:node_positions[edge.data('source')]["x"],
y1:node_positions[edge.data('source')]["y"],
x2:node_positions[edge.data('target')]["x"],
y2:node_positions[edge.data('target')]["y"],
stroke: __convertColor(edge.renderedStyle('line-color')),
'stroke-width': edge.renderedStyle('width').replace('px', ''),
'stroke-dasharray': '5,5'})
} else {
network.line({ x1:node_positions[edge.data.source]["x"],
y1:node_positions[edge.data.source]["y"],
x2:node_positions[edge.data.target]["x"],
y2:node_positions[edge.data.target]["y"],
stroke: __convertColor(edge.data.current_color),
'stroke-width': edge.data.current_width.replace('px', '')})
network.line({ x1:node_positions[edge.data('source')]["x"],
y1:node_positions[edge.data('source')]["y"],
x2:node_positions[edge.data('target')]["x"],
y2:node_positions[edge.data('target')]["y"],
stroke: __convertColor(edge.renderedStyle('line-color')),
'stroke-width': edge.renderedStyle('width').replace('px', '')})
}


});

data.elements.nodes.forEach( function(node) {
if (!node.data.compound) {
data.nodes().forEach( function(node) {
if (!node.data('compound')) {
var group = network.g();
group.transform('translate', node.position.x, node.position.y)
if (node.data.current_shape === 'ellipse') {
group.circle({r:15, fill:__convertColor(node.data.current_color)});
} else if (node.data.current_shape === 'rectangle') {
group.rect({x:-15, y:-15, width:30, height:30, fill:__convertColor(node.data.current_color)});
} else if (node.data.current_shape === 'roundrectangle') {
group.rect({x:-15, y:-15, rx:5, ry:5, width:30, height:30, fill:__convertColor(node.data.current_color)});
} else if (node.data.current_shape === 'triangle') {
group.polygon({points:'0,-20 17,10 -17,10', fill:__convertColor(node.data.current_color)});
} else if (node.data.current_shape === 'hexagon') {
group.polygon({points:'0,15 13,7.5 13,-7.5 0,-15 -13,-7.5 -13,7.5', fill:__convertColor(node.data.current_color)})
group.transform('translate', node.position('x'), node.position('y'))
if (node.renderedStyle('shape') === 'ellipse') {
group.circle({r:15, fill:__convertColor(node.renderedStyle('background-color'))});
} else if (node.renderedStyle('shape') === 'rectangle') {
group.rect({x:-15, y:-15, width:30, height:30, fill:__convertColor(node.renderedStyle('background-color'))});
} else if (node.renderedStyle('shape') === 'roundrectangle') {
group.rect({x:-15, y:-15, rx:5, ry:5, width:30, height:30, fill:__convertColor(node.renderedStyle('background-color'))});
} else if (node.renderedStyle('shape') === 'triangle') {
group.polygon({points:'0,-20 17,10 -17,10', fill:__convertColor(node.renderedStyle('background-color'))});
} else if (node.renderedStyle('shape') === 'hexagon') {
group.polygon({points:'0,15 13,7.5 13,-7.5 0,-15 -13,-7.5 -13,7.5', fill:__convertColor(node.renderedStyle('background-color'))})
.transform('rotate', 30);
} else if (node.data.current_shape === 'octagon') {
group.polygon({points:'0,15 10.6,10.6 15,0 10.6,-10.6 0,-15 -10.6,-10.6 -15,0 -10.6,10.6', fill:__convertColor(node.data.current_color)})
} else if (node.renderedStyle('shape') === 'octagon') {
group.polygon({points:'0,15 10.6,10.6 15,0 10.6,-10.6 0,-15 -10.6,-10.6 -15,0 -10.6,10.6', fill:__convertColor(node.renderedStyle('background-color'))})
.transform('rotate', 22.5);
} else if (node.data.current_shape === 'vee') {
group.polygon({points:'0,20 17,-10 0,0 -17,-10', fill:__convertColor(node.data.current_color)});
} else if (node.data.current_shape === 'diamond') {
group.rect({x:-13, y:-13, width:26, height:26, fill:__convertColor(node.data.current_color)})
} else if (node.renderedStyle('shape') === 'vee') {
group.polygon({points:'0,20 17,-10 0,0 -17,-10', fill:__convertColor(node.renderedStyle('background-color'))});
} else if (node.renderedStyle('shape') === 'diamond') {
group.rect({x:-13, y:-13, width:26, height:26, fill:__convertColor(node.renderedStyle('background-color'))})
.transform('rotate', 45);
} else if (node.data.current_shape === 'rhomboid') {
group.rect({x:-13, y:-15, width:26, height:30, fill:__convertColor(node.data.current_color)})
} else if (node.renderedStyle('shape') === 'rhomboid') {
group.rect({x:-13, y:-15, width:26, height:30, fill:__convertColor(node.renderedStyle('background-color'))})
.transform('skewX', 30);
}

text = node.data.name;
if (node.data.gene_name !== '') { text = node.data.gene_name; }
text = node.data('name');
if (node.data('gene_name') !== '') { text = node.data('gene_name'); }

group.text({y:6, fill:"none", stroke:'#888888'}).content(text)
.attr('text-anchor', 'middle')
Expand Down
10 changes: 5 additions & 5 deletions planet/static/js/planet_xgmml.js
View file
Expand Up @@ -63,8 +63,8 @@ function writeXGMML(data) {
xw.writeAttributeString( 'value', '#ffffff');
xw.writeEndElement();

data.nodes.forEach( function(node) {
if (!node.data.compound)
data.nodes().forEach( function(node) {
if (!node.data('compound'))
{
xw.writeStartElement( 'node' );
xw.writeAttributeString( 'id', node.data('id') );
Expand All @@ -82,8 +82,8 @@ function writeXGMML(data) {
xw.writeAttributeString( 'width', '1' );
xw.writeAttributeString( 'fill', __convertColor(node.renderedStyle('background-color')) );
xw.writeAttributeString( 'outline', "#000000" );
xw.writeAttributeString( 'x', node.position.x);
xw.writeAttributeString( 'y', node.position.y);
xw.writeAttributeString( 'x', node.position('x'));
xw.writeAttributeString( 'y', node.position('y'));
xw.writeAttributeString( 'h', '30.0');
xw.writeAttributeString( 'w', '30.0');
xw.writeAttributeString( 'type', __convertShape(node.renderedStyle('shape')) );
Expand Down Expand Up @@ -112,7 +112,7 @@ function writeXGMML(data) {
}
});

data.edges.forEach( function(edge) {
data.edges().forEach( function(edge) {
xw.writeStartElement( 'edge' );
xw.writeAttributeString( 'id', edge.data('id') );
xw.writeAttributeString( 'label', edge.data('id') );
Expand Down

0 comments on commit 554ca84

Please sign in to comment.