linking.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<title>phantasus - Linking</title>
<link rel="stylesheet" href="css/phantasus-latest.min.css">
<script type="text/javascript" src="js/phantasus-external-latest.min.js"></script>
<script src="js/phantasus-latest.min.js"></script>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<h2>phantasus Configuration Options</h2>
<h3>
Please note that the correct HTTP <a target="_blank"
href="https://en.wikipedia.org/wiki/Cross-origin_resource_sharing">CORS</a>
headers must be set if any of your resources are hosted on a
different domain.
</h3>
<p class="text-muted">Load phantasus with a pre-configured matrix</p>
<p>
The phantasus website accepts the following request parameters <br/>'json':
a URI encoded JSON configuration object. <br/>'url': a URL to a
JSON configuration file. <br/> <br/> <b>Example</b><br/>
<code>{columnAnnotations : [ { file :
'//s3.amazonaws.com/data.clue.io/morpheus/Achilles_v2.4_SampleInfo_small.txt',
datasetField : 'id', fileField : 'id' } ], columns : [ { field :
'id', display : 'text' }, { field : 'Site_primary', display :
'color' } ], dataset :
'//s3.amazonaws.com/data.clue.io/morpheus/Achilles_QC_v2.4.3.rnai.Gs.gct'}</code>
<br/> <a href="#" name="open">Open Example In phantasus</a>
</div>
</div>
<!-- <div id="header" class="row"> -->
<!-- <div class="col-xs-12"> -->
<!-- <input type="button" class="btn btn-default btn-sm" -->
<!-- value="Expand All" name="expand"> <input type="button" -->
<!-- class="btn btn-default btn-sm" value="Collapse All" name="collapse"> -->
<!-- </div> -->
<!-- </div> -->
<div class="row">
<div class="col-xs-12">
<h4>
<a data-toggle="collapse">dataset</a>
</h4>
<p class="collapse">
A File or URL to a <a target="_blank"
href="http://support.lincscloud.org/hc/en-us/articles/202105453-GCT-Gene-Cluster-Text-Format-">GCT
1.3</a>, <a target="_blank"
href="http://www.broadinstitute.org/cancer/software/genepattern/gp_guides/file-formats/sections/gct">GCT
1.2</a>, <a target="_blank"
href="https://wiki.nci.nih.gov/display/TCGA/Mutation+Annotation+Format+%28MAF%29+Specification">MAF</a>,
<a target="_blank"
href="http://www.broadinstitute.org/cancer/software/gsea/wiki/index.php/Data_formats#GMT:_Gene_Matrix_Transposed_file_format_.28.2A.gmt.29">GMT</a>,
or a tab-delimited text file. Can also be an array of File or URLs
in which case the datasets are combined by matching on column ids.
</p>
<h4>
<a data-toggle="collapse">rowAnnotations/columnAnnotations</a>
</h4>
<p class="collapse">
Optional array of
<code>{file:String, datasetField:String, fileField:String,
include:[String]}</code>
<br/>
<code>file</code>
: An xlsx file, a tab-delimited text file, or a gmt file.<br/>
<code>datasetField</code>
: Field to match in dataset.<br/>
<code>fileField</code>
: Field to match in file.<br/>
<code>include</code>
: Optional array of fields to include from file. <br/> <b>Example:</b>
Annotate rows matching 'name' field in dataset to 'id' field in
file at https://MY_URL.
<code>[{file:'https://MY_URL', datasetField:'name',
fileField:'id'}]</code>
</p>
<h4>
<a data-toggle="collapse">rowGroupBy/columnGroupBy</a>
</h4>
<p class="collapse">
Optional rray of metadata names to group the heat map by. <br/> <b>Example:</b>
Group by the type and gender metadata fields.
<code>['type', 'gender']</code>
</p>
<h4>
<a data-toggle="collapse">colorScheme</a>
</h4>
<p class="collapse">
Optional object
<code>{type:String, stepped:boolean, map:[{value:Number,
color:String}]}</code>
that describes value to color mapping.
<code>type</code>
: 'fixed' or 'relative' color scheme.<br/>
<code>stepped</code>
: Whether color scheme is continuous (false) or discrete (true). <br/>
<code>map</code>
Array of value, color pairs.<br/> <b>Example:</b> Use a fixed
color scheme with color stops at -100, -90, 90, and 100. <br/>
<code>{ type : 'fixed', stepped:false, map : [ { value :
-100, color : '#abdda4' }, { value : -90, color : 'white' }, {
value : 90, color : 'white' }, { value : 100, color : 'red' } ] };</code>
</p>
<h4>
<a data-toggle="collapse">rowSortBy/columnSortBy</a>
</h4>
<p class="collapse">
Optional array of metadata names and sort order (
<code>[{field:String, order:Number}]</code>
). <br/>
<code>field</code>
: Metadata field name. <br/>
<code>order</code>
: 0 for ascending, 1 for descending. <br/> <b>Example:</b> Sort
ascending by gene, and then descending by stdev
<code>[{field:'gene', order:0}, {field:'stdev', order:1}]</code>
</p>
<h4>
<a data-toggle="collapse">rowDendrogram/columnDendrogram</a>
</h4>
<p class="collapse">
Optional URL to a dendrogram in <a target="_blank"
href="https://en.wikipedia.org/wiki/Newick_format">Newick
format</a>
</p>
<h4>
<a data-toggle="collapse">rowDendrogramField/columnDendrogramField</a>
</h4>
<p class="collapse">Optional metadata field in dataset to match
leaf node ids in the dendrogram Newick file.</p>
<h4>
<a data-toggle="collapse">rows/columns</a>
</h4>
<p class="collapse">
Optional array of objects describing how to display metadata fields
(
<code>[{field:String, display:String}]</code>
). <br/>
<code>field</code>
: Metadata field name <br/>
<code>display</code>
: A comma delimited string that describes how to render a metadata
field. Options are text, color, bar, highlight, shape, discrete,
and continuous name <br/> <b>Example</b> Display id as text and
stdev using text and color
<code>[{field:'id', display:'text'}, {field:'stdev',
display:'text, color'}]</code>
</p>
<h4>
<a data-toggle="collapse">tools</a>
</h4>
<p class="collapse">
Optional array of tools to run at load time
<code>[{name:String, params:Object}]</code>
<b>Example:</b> Cluster rows and columns. <br/>
<code>[{
name: 'Hierarchical Clustering',
params: {cluster: 'Rows and columns'}
}]</code>
</p>
</div>
</div>
<div class="row"></div>
<div class="row"></div>
<div class="row"></div>
<div class="row"></div>
<div class="row"></div>
<div class="row"></div>
</div>
<script type="text/javascript">
var links = $(document.body).find('[data-toggle=collapse]');
var collapse = $(document.body).find('.collapse');
for (var i = 0; i < collapse.length; i++) {
var $c = $(collapse[i]);
var $l = $(links[i]);
$c.attr('id', i);
$l.attr('href', '#' + i);
}
$('#header').find('[name=expand]').on('click', function () {
$(document.body).find('.collapse').collapse('show');
});
$('#header').find('[name=collapse]').on('click', function () {
$(document.body).find('.collapse').collapse('hide');
});
$(document.body)
.find('[name=open]')
.on(
'click',
function (e) {
var json = {
columnAnnotations: [{
file: '//s3.amazonaws.com/data.clue.io/morpheus/Achilles_v2.4_SampleInfo_small.txt',
datasetField: 'id',
fileField: 'id'
}],
columns: [{
field: 'id',
display: 'text'
}, {
field: 'Site_primary',
display: 'color'
}],
dataset: '//s3.amazonaws.com/data.clue.io/morpheus/Achilles_QC_v2.4.3.rnai.Gs.gct'
};
window.location.href = 'http://www.broadinstitute.org/cancer/software/morpheus?json='
+ encodeURIComponent(JSON.stringify(json));
});
setTimeout(function () {
$(document.body).find('.collapse').collapse('show');
}, 200);
</script>
<script>
phantasus.Util.loadTrackingCode();
</script>
</body>
</html>
