Personal tools

Template:PeakCountPerSample: Difference between revisions

From FANTOM5_SSTAR

Jump to: navigation, search
No edit summary
No edit summary
Line 4: Line 4:
<script language="javascript" type="text/javascript" src="/resource_browser/rb_js/highcharts/modules/exporting.js"></script>
<script language="javascript" type="text/javascript" src="/resource_browser/rb_js/highcharts/modules/exporting.js"></script>
<script type="text/javascript">
<script type="text/javascript">
$(document).ready(function (){
$(document).ready(function (){
 
var content    = "</html>{{#var:db_content}}<html>";
var content    = "</html>{{{1}}}<html>";
var delimiter = "</html>{{{4}}}<html>";
var delimiter  = "</html>{{{2}}}<html>";
var prop_delimiter = "</html>{{{5}}}<html>";
var delimiter_internal  = "</html>{{{3}}}<html>";
var graph_title = "</html>{{{6}}}<html>";
var graph_subtitle = "</html>{{{7}}}<html>";
var xAxis_title = "</html>{{{8}}}<html>";
var yAxis_title = "</html>{{{9}}}<html>";
var content_array = content.split(delimiter);
var content_array = content.split(delimiter);
var categories_yAxis = [];
var categories_xAxis = [];


var ids    = [];
var ids    = [];
var symbols = [];
var symbols = [];
var desc    = [];
var desc    = [];
var peakscount =[];
var peakscount =[];
var max_peakcount=0;


for(var i=0, l=content_array.length; i<l; i++){
for(var i=0, l=content_array.length; i<l-1; i++){
var tmp_array = content_array[i].split(delimiter_internal);
var symb_temp="";
var tmp2= categories_extended_array[i];
var id_temp="";
ids.push(tmp_array[0]);
var desc_temp="";
desc.push(tmp_array[1]);
var count_temp="";
symbols.push(tmp_array[2]);
var tmp_array = content_array[i].split(prop_delimiter);
if(tmp_array.length>0){
id_temp=tmp_array[0];
}
if(tmp_array.length>1){
symb_temp=tmp_array[1];
}
}
if(tmp_array.length>2){
desc_temp=tmp_array[2];
}
if(tmp_array.length>3){
var tt = parseFloat(tmp_array[3]);
if(tt> max_peakcount){
max_peakcount=tt;
}
peakscount.push(tmp_array[3]);
count_temp=tmp_array[3];
}
categories_xAxis.push('<b>EntrezGene:</b> <a href="https://fantom5-collaboration.gsc.riken.jp/resource_browser/EntrezGene:'+id_temp+'" target="_blank">'+id_temp+'</a>'+'<br>'+'<b>Symbol:</b>'+symb_temp+'<br>'+'<b>Description:</b>'+desc_temp);


for(var i=0, l=ids.length; i<l; i++){
var peak_content ="";
</html>
{{#ask:[[Category:FFCP]][[EntrezGene::<html>ids[0]</html>]]
|format=array |name=peaks
}}
{{#arrayprint: tfdetailsarray}}
<html>
var peak_count=peak_content.length;
peakscount.push(peak_count);
}
}


    var chart;
 
  var chart;
   // Build the chart
   // Build the chart
     var options={
     var options={
             chart: {
             chart: {
                renderTo: 'container',
                 type: 'scatter',
                 type: 'scatter',
                 zoomType: 'xy'
                 zoomType: 'xy'
               
             },
             },
             title: {
             title: {
                 text: 'Height Versus Weight of 507 Individuals by Gender'
                 text:graph_title
             },
             },
             subtitle: {
             subtitle: {
                 text: 'Source: Heinz  2003'
                 text: graph_subtitle
             },
             },
             xAxis: {
             xAxis: {
                categories: categories_xAxis,
                 title: {
                 title: {
                     enabled: true,
                     enabled: false,
                     text: 'Height (cm)'
                     text: xAxis_title
                 },
                 },
                 startOnTick: true,
                 labels: {
                 endOnTick: true,
                    enabled: false,
                    overflow: 'justify'
                },
             
                 startOnTick: false,
                 showLastLabel: true
                 showLastLabel: true
             },
             },
             yAxis: {
             yAxis: {
              categories: categories_yAxis,
                 title: {
                 title: {
                     text: 'Weight (kg)'
                    enabled: false,
                 }
                     text: yAxis_title
                },
                labels: {
                    enabled: false,
                    overflow: 'justify'
                },
             
                max:max_peakcount,
                min:0,
                startOnTick: false,
                showLastLabel: true
               
            },
            tooltip: {
                formatter:function(){
                $("#mytoolTip").html(this.x+'<br><b>Number of peaks:</b> '+this.y) ;             
                 return  this.x+'<br><b>Number of peaks:</b> '+this.y;
            }
                   
             },
             },
             legend: {
             legend: {
                 layout: 'vertical',
                 layout: 'vertical',
                 align: 'left',
                 align: 'right',
                 verticalAlign: 'top',
                 verticalAlign: 'top',
                 x: 100,
                 x: -10,
                 y: 70,
                 y: 30,
                 floating: true,
                 floating: true,
                 backgroundColor: '#FFFFFF',
                 backgroundColor: '#FFFFFF',
                 borderWidth: 1
                 borderWidth: 2
             },
             },
             plotOptions: {
             plotOptions: {
                 scatter: {
                 scatter: {
                     marker: {
                     marker: {
                         radius: 5,
                         symbol: 'square',
                         states: {
                         states: {
                             hover: {
                             hover: {
Line 92: Line 131:
                             }
                             }
                         }
                         }
                    },
                    tooltip: {
                        headerFormat: '<b>{series.name}</b><br>',
                        pointFormat: '{point.x} cm, {point.y} kg'
                     }
                     }
                 }
                 }
             },
             },
             series: [
             series: [{  
                  {  
                   name :'TF factors',
                   name ="peak counts",
                   color: 'rgba(67, 110, 238, .7)',
                   color: 'rgba(223, 83, 83, .5)',
  data: []
  data: []
  },
  }]
                  {
                  name: 'transcription factor',
                  color: 'rgba(119, 152, 191, .5)',
                  data: []
                  }]


       };
       };
     var series_temp = {};
     var series_temp = {data: []};
     for(var i=0, l=peakscount.length; i<l; i++){
     for(var i=0, l=peakscount.length; i<l; i++){
     var tmp = peakscount[i];
     var tmp = peakscount[i];
     var num = parseFloat(tmp);
     var num = parseFloat(tmp);
     series_temp.data.push(num*100);
     options.series[0].data.push(num);
     }
     }
    options.series[0].push(series_temp );
 
    series_temp = {};
      
    for(var i=0, l=symbols.length; i<l; i++){
    var tmp = symbols[i];
    series_temp.data.push(tmp);
    }
     options.series[1].push(series_temp );


var chart = new Highcharts.Chart(options);
var chart = new Highcharts.Chart(options);
});
});


}
</script>
</script>
<!-- if it does not work test for {{#arrayprint:peaks}} -->
</html>
</html>
<div id='mytoolTip'></div>
<div id="container" style="min-width:250px; height: auto; margin: 0 auto"></div>

Revision as of 15:02, 20 September 2013

Retrieved from "http://f5-webapp4.gsc.riken.jp/resource_browser/index.php?title=Template:PeakCountPerSample&oldid=3076012"