Cytoscape test2: Difference between revisions
From FANTOM5_SSTAR
No edit summary |
No edit summary |
||
| (23 intermediate revisions by the same user not shown) | |||
| Line 6: | Line 6: | ||
</style> | </style> | ||
<h1 id="firstHeading" class="firstHeading">FF: | <h1 id="firstHeading" class="firstHeading">FF:10717-109I6, TF to Motif to TF network</h1> | ||
<p>Mouseover nodes and edges to see attributes. Motifs are shown in orange, TFs are shown in blue. Promoter and z-score are attributes of the Motif to TF edges (blue arrow). TF to Motif edges are shown in orange.</p> | |||
<p>Motifs shown are the top (maximum 30) motifs in the sample. TFs shown have at least one CAGE promoter with at at least 10 TPM expression (RLE normalized) in the sample. Edges shown have a z-score of at least 1.5 (based on correlation between motif activity and promoter expression). | |||
</p> | |||
<div id="cytoscapeweb" style="width:800px;height:600px"> | <div id="cytoscapeweb" style="width:800px;height:600px"> | ||
Cytoscape Web will replace the contents of this div with your graph. | Cytoscape Web will replace the contents of this div with your graph. | ||
| Line 20: | Line 25: | ||
<script type="text/javascript" src="/resource_browser/rb_js/cytoscapeweb/js/min/cytoscapeweb.min.js"></script> | <script type="text/javascript" src="/resource_browser/rb_js/cytoscapeweb/js/min/cytoscapeweb.min.js"></script> | ||
<!-- Load data --> | <!-- Load data --> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
var request = new XMLHttpRequest(); | var request = new XMLHttpRequest(); | ||
request.open("GET", "https://fantom5-collaboration.gsc.riken.jp/resource_browser/nwfiles/ | request.open("GET", "https://fantom5-collaboration.gsc.riken.jp/resource_browser/nwfiles/10717-109I6_2.graphml", false); | ||
request.send(null); | request.send(null); | ||
xml = request.responseText; | xml = request.responseText; | ||
| Line 41: | Line 45: | ||
var target = event.target; | var target = event.target; | ||
var lurl = "https://fantom5-collaboration.gsc.riken.jp/resource_browser/RB_SearchResults?sq="+target.data[" | var lurl = "https://fantom5-collaboration.gsc.riken.jp/resource_browser/RB_SearchResults?sq="+target.data["label"]; | ||
window.location = lurl; | |||
alert(lurl); | //alert(lurl); | ||
} | } | ||
| Line 62: | Line 66: | ||
entries: [ { attrValue: "motif", value: "#ff9900" }, | entries: [ { attrValue: "motif", value: "#ff9900" }, | ||
{ attrValue: "tf", value: "#0099ff" } ] | { attrValue: "tf", value: "#0099ff" } ] | ||
}; | |||
var shapeMapper = { | |||
attrName: "type", | |||
entries: [ { attrValue: "motif", value: "rectangle" }, | |||
{ attrValue: "tf", value: "ELLIPSE" } ] | |||
}; | |||
var edgeColorMapper = { | |||
attrName: "type", | |||
entries: [ { attrValue: "has_motif", value: "#ff9900" }, { attrValue: "promotes", value: "#0099ff" } ] | |||
}; | |||
var edgeArrowMapper = { | |||
attrName: "type", | |||
entries: [ { attrValue: "has_motif", value: "arrow" }, { attrValue: "promotes", value: "delta" } ] | |||
}; | |||
var edgeTooltipMapper = { | |||
attrName: "type", | |||
entries: [ { attrValue: "has_motif", value: "" }, { attrValue: "promotes", value: "<b>Promoter: ${promoter}</b><br />Z-Score: ${zscore}" } ] | |||
}; | }; | ||
| Line 72: | Line 97: | ||
}, | }, | ||
nodes: { | nodes: { | ||
//label: { passthroughMapper: { attrName: "id" } }, | |||
tooltipText: "<b>${type}: ${label}</b>", | tooltipText: "<b>${type}: ${label}</b>", | ||
shape: "ellipse", | shape: { defaultValue: "ellipse", discreteMapper: shapeMapper }, | ||
borderWidth: 1, | borderWidth: 1, | ||
borderColor: "#000000", | borderColor: "#000000", | ||
size: 30, | size: 30, | ||
color: "#ff9900", | //color: "#ff9900", | ||
color: { defaultValue: "#ff9900", discreteMapper: colorMapper }, | |||
//opacity: 0.8, | //opacity: 0.8, | ||
opacity: { customMapper: { functionName: "customOpacity" } }, | opacity: { customMapper: { functionName: "customOpacity" } }, | ||
| Line 86: | Line 112: | ||
}, | }, | ||
edges: { | edges: { | ||
width: { passthroughMapper: { attrName: "zscore" } }, | width: { defaultValue: 5, passthroughMapper: { attrName: "zscore" } }, | ||
label: { passthroughMapper: { attrName: "promoter" } }, | label: { passthroughMapper: { attrName: "promoter" } }, | ||
tooltipText: "<b>Promoter: ${promoter}</b><br />Z-Score: ${zscore}", | //tooltipText: "<b>Promoter: ${promoter}</b><br />Z-Score: ${zscore}", | ||
color: "#011e59", | tooltipText: { defaultValue: "", discreteMapper: edgeTooltipMapper }, | ||
//color: "#011e59", | |||
color: { defaultValue: "#011e59", discreteMapper: edgeColorMapper }, | |||
targetArrowShape: { defaultValue: "delta", discreteMapper: edgeArrowMapper }, | |||
sourceArrowShape: "", | sourceArrowShape: "", | ||
labelGlowOpacity: 0.8, | labelGlowOpacity: 0.8, | ||
| Line 132: | Line 159: | ||
network: xml, | network: xml, | ||
visualStyle: visual_style, | visualStyle: visual_style, | ||
nodeTooltipsEnabled: true, | |||
edgeTooltipsEnabled: true, | |||
// hide pan zoom | // hide pan zoom | ||
panZoomControlVisible: true | panZoomControlVisible: true | ||
Latest revision as of 12:57, 8 May 2012
FF:10717-109I6, TF to Motif to TF network
Mouseover nodes and edges to see attributes. Motifs are shown in orange, TFs are shown in blue. Promoter and z-score are attributes of the Motif to TF edges (blue arrow). TF to Motif edges are shown in orange.
Motifs shown are the top (maximum 30) motifs in the sample. TFs shown have at least one CAGE promoter with at at least 10 TPM expression (RLE normalized) in the sample. Edges shown have a z-score of at least 1.5 (based on correlation between motif activity and promoter expression).
Cytoscape Web will replace the contents of this div with your graph.
