User:Hisa/cytoscape test: Difference between revisions
From FANTOM5_SSTAR
No edit summary |
No edit summary |
||
| Line 6: | Line 6: | ||
#cytoscapeweb { width: 100%; height: 100%; } | #cytoscapeweb { width: 100%; height: 100%; } | ||
</style> | </style> | ||
<div id="cytoscapeweb" style="width:100%;height:600px" resize:both;> | <div id="cytoscapeweb" style="width:100%;height:600px" resize:both;> | ||
| Line 28: | Line 26: | ||
var div_id = "cytoscapeweb"; | var div_id = "cytoscapeweb"; | ||
// | var xml = '\ | ||
<graphml>\ | |||
<key id="label" for="all" attr.name="label" attr.type="string"/>\ | |||
<key id="weight" for="node" attr.name="weight" attr.type="double"/>\ | |||
<graph edgedefault="directed">\ | |||
<node id="1">\ | |||
<data key="label">A</data>\ | |||
<data key="weight">2.0</data>\ | |||
</node>\ | |||
<node id="2">\ | |||
<data key="label">B</data>\ | |||
<data key="weight">1.5</data>\ | |||
</node>\ | |||
<node id="3">\ | |||
<data key="label">C</data>\ | |||
<data key="weight">1.0</data>\ | |||
</node>\ | |||
<edge source="1" target="2">\ | |||
<data key="label">A to B</data>\ | |||
</edge>\ | |||
<edge source="1" target="3">\ | |||
<data key="label">A to C</data>\ | |||
</edge>\ | |||
</graph>\ | |||
</graphml>\ | |||
'; | |||
// initialization options | // initialization options | ||
| Line 40: | Line 61: | ||
}; | }; | ||
var vis = new org.cytoscapeweb.Visualization("cytoscapeweb", options); | |||
var vis = new org.cytoscapeweb.Visualization( | |||
vis.draw( | // draw | ||
var draw_options = { | |||
// your data goes here | |||
network: xml, | |||
// show edge labels too | |||
edgeLabelsVisible: true, | |||
// let's try another layout | |||
layout: "Tree", | |||
// hide pan zoom | |||
panZoomControlVisible: false | |||
}; | |||
vis.draw(draw_options); | |||
}; | }; | ||
</script> | </script> | ||
Revision as of 16:31, 27 June 2012
Cytoscape Web will replace the contents of this div with your graph.
