Author: marekz
Date: 2011-07-06 05:54:18 -0700 (Wed, 06 Jul 2011)
New Revision: 26058
Modified:
cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/cytoscapeweb-svg.js
cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/main.html
Log:
Added a third graph to demo; fixed some issues.
Modified: cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/cytoscapeweb-svg.js
===================================================================
--- cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/cytoscapeweb-svg.js
2011-07-06 01:19:46 UTC (rev 26057)
+++ cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/cytoscapeweb-svg.js
2011-07-06 12:54:18 UTC (rev 26058)
@@ -35,7 +35,7 @@
"borderColor": "#666666",
"borderWidth": 3,
"opacity": 1,
- "hoverColor": null,
+ "hoverColor": "pink",
"hoverBorderColor": null,
"hoverOpacity": null,
"dragColor": null,
@@ -720,6 +720,7 @@
this._selected = !this._selected;
this._draw();
this._triggerEvent("click");
+ this._hoverEnd(); // M
};
@@ -982,7 +983,7 @@
if (this.getRenderedStyle("forwardArrowShape")
== "DELTA") path += " " + Shapes.buildArrow(apx, apy, 6, 10, Math.atan2(-acy,
-acx), 1);
if (this.getRenderedStyle("backwardArrowShape")
== "DELTA") path += " " + Shapes.buildArrow(bpx, bpy, 6, 10, Math.atan2(-bcy,
-bcx), 1);
- console.log(path);
+
return path;
};
Modified: cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/main.html
===================================================================
--- cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/main.html 2011-07-06
01:19:46 UTC (rev 26057)
+++ cytoscapeweb/branches/gsoc2011/cytoscapeweb-svg/main.html 2011-07-06
12:54:18 UTC (rev 26058)
@@ -64,6 +64,37 @@
width: 4
}
}
+
+ var simpleGraph = {
+ nodes: [
+ {id: "n1", x: 220, y: 30},
+ {id: "n2", x: 0, y: 97},
+ {id: "n3", x: 54, y: 185},
+ {id: "n4", x: 200, y: 191},
+ {id: "n5", x: 210, y: 254},
+ {id: "n6", x: 60, y: -5},
+ {id: "n7", x: 280, y: 170}
+ ],
+ edges: [
+ {id: "e1", source: "n1", target: "n2",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e2", source: "n2", target: "n1",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e3", source: "n1", target: "n3",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e4", source: "n2", target: "n3",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e5", source: "n4", target: "n5",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e6", source: "n5", target: "n2",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e7", source: "n3", target: "n5",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e8", source: "n1", target: "n4",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e9", source: "n3", target: "n4",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e10", source: "n4", target: "n6",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e11", source: "n6", target: "n4",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e12", source: "n3", target: "n6",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e14", source: "n4", target: "n7",
style: {forwardArrowShape: "DELTA", backwardArrowShape: "DELTA"}},
+ {id: "e13", source: "n4", target: "n7",
style: {forwardArrowShape: "DELTA"}},
+ {id: "e15", source: "n7", target: "n4",
style: {forwardArrowShape: "DELTA"}},
+
+
+ ]
+ }
var petersenGraph = {
nodes: [
@@ -121,18 +152,13 @@
}
var vis;
window.onload = function() {
-
vis = new Visualization("container-div");
-
- loadPetersen();
- styleBasic();
-
-
-
+ load(simpleGraph);
+ setstyle(basicStyle);
}
- function loadPetersen() {
- vis.loadGraph(petersenGraph);
+ function load(graph) {
+ vis.loadGraph(graph);
var nodes = vis.getNodes();
var clickEvent = function() {
@@ -144,27 +170,13 @@
}
vis.draw();
}
- function loadRing() {
- vis.loadGraph(ringGraph);
- vis.draw();
- }
- function styleBasic() {
- vis.loadStyles(basicStyle);
+ function setstyle(style) {
+ vis.loadStyles(style);
vis.draw();
}
+
- function styledemo() {
- vis.loadStyles(demoStyle);
- vis.draw();
- }
-
- function styleDark() {
- vis.loadStyles(darkStyle);
- vis.draw();
- }
-
-
</script>
@@ -176,14 +188,15 @@
<div id="container-div"></div>
Load graph:
<select>
- <option onclick="loadPetersen()">Petersen
demo</option>
- <option onclick="loadRing()">Shapes
demo</option>
+ <option onclick="load(simpleGraph)">Simple
graph</option>
+ <option onclick="load(petersenGraph)">Petersen
graph</option>
+ <option onclick="load(ringGraph)">Style
demo</option>
</select>
Load style:
<select>
- <option onclick="styleBasic()">Basic
Style</option>
- <option onclick="styledemo()">Demo
Style</option>
- <option onclick="styleDark()">Dark
style</option>
+ <option onclick="setstyle(basicStyle)">Basic
Style</option>
+ <option onclick="setstyle(demoStyle)">Classic
Style</option>
+ <option onclick="setstyle(darkStyle)">Dark
style</option>
</select>
--
You received this message because you are subscribed to the Google Groups
"cytoscape-cvs" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/cytoscape-cvs?hl=en.
