swh:1:snp:0c004a03453a29b80f921a24433f7e780b9ceb53
Raw File
Tip revision: c6bb0e960554a23eb712690cbd7f8e3f7d79ca0d authored by Alexey Sergushichev on 02 July 2021, 13:19:49 UTC
Update js
Tip revision: c6bb0e9
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>
back to top