Personal tools

Template:PeakCountPerSample: Difference between revisions

From FANTOM5_SSTAR

Jump to: navigation, search
No edit summary
No edit summary
 
(19 intermediate revisions by the same user not shown)
Line 47: Line 47:
count_temp=tmp_array[3];
count_temp=tmp_array[3];
}
}
var peak_c = peakscount[i];
  item = {}
  item = {}
        item ["EntrezGene"] = id_temp;
      item ["EntrezGene"] = id_temp;
        item ["Symbol"] = symb_temp;
      item ["Symbol"]     = symb_temp;
        item ["Description"] = desc_temp;
      item ["Description"] = desc_temp;
categories_xAxisTemp.push(item);
      item ["PeakCount"]  = peak_c;
//categories_xAxisTemp.push(item);
categories_xAxis.push('EntrezGene:'+id_temp+'/'+'Symbol:'+symb_temp+'/'+'Description:'+desc_temp);
categories_xAxis.push('EntrezGene:'+id_temp+'/'+'Symbol:'+symb_temp+'/'+'Description:'+desc_temp);


Line 79: Line 81:


             xAxis: {
             xAxis: {
                    max:50,
                 
                     min:20,
                     min:20,
                 categories: categories_xAxis,
                 categories: categories_xAxis,
Line 86: Line 88:
                     text: xAxis_title
                     text: xAxis_title
                 },
                 },
                lineWidth: 0,
                minorGridLineWidth: 0,
                lineColor: 'transparent',
                 labels: {
                 labels: {
                     step: 1,
                     step: 20,
                     rotation: -90,
                     rotation: -90,
                     enabled: true,
                     enabled: true,
Line 93: Line 98:
                     align: 'right',
                     align: 'right',
                     style: {
                     style: {
                         fontSize: '8px',
                        width:'30px',
                        height:'150px',
                         fontSize: '9px',
                         fontFamily: 'Verdana, sans-serif'
                         fontFamily: 'Verdana, sans-serif'
                     },
                     },
Line 108: Line 115:
                   setExtremes: function(event) {
                   setExtremes: function(event) {
                           if (event.max) {
                           if (event.max) {
                             var frequency = Math.floor((event.max - event.min) / 17);
                             var frequency = Math.floor((event.max - event.min) / 20);
                             this.options.labels.step = frequency;
                             this.options.labels.step = frequency;
                           } else {
                           } else {
                                   this.options.labels.step = 1;
                                   this.options.labels.step = 20;
                           }
                           }
                   }
                   }
Line 125: Line 132:
                     text: yAxis_title
                     text: yAxis_title
                 },
                 },
                gridLineColor: 'transparent',
                 labels: {
                 labels: {
                     enabled: true,
                     enabled: true,
                     overflow: 'justify'
                     overflow: 'justify',
                style:{
                    width:'10px',
                }
                 },
                 },
             
                tickInterval:5,
                 max:max_peakcount,
                 max:max_peakcount,
                 min:0,
                 min:0,
Line 160: Line 171:
             },
             },
             legend: {
             legend: {
                enabled:false,
                 layout: 'vertical',
                 layout: 'vertical',
                 align: 'right',
                 align: 'right',
Line 186: Line 198:
                 scatter: {
                 scatter: {
                     marker: {
                     marker: {
                         symbol: 'square',
                        radius: 3,
                         symbol: 'circle',
                         states: {
                         states: {
                             hover: {
                             hover: {
Line 223: Line 236:
      
      


var chart = new Highcharts.Chart(options, function(cha){
new Highcharts.Chart(options);   
//var chart = new Highcharts.Chart(options, function(cha){


         $("#list").change(function(){
         //$("#list").change(function(){
            changeType(cha, this.value);
          // changeType(cha, this.value);
         });
         //});
          
          
    });
  // });


});
});
Line 238: Line 252:
  alert(options.xAxis.categories)
  alert(options.xAxis.categories)
     alert(options.series[0].data)
     alert(options.series[0].data)
//var sorted = sortByKey(categories_xAxisTemp[0], "Symbol");
    //    alert(sorted);
     if(selVal == 1 || selVal == '')
     if(selVal == 1 || selVal == '')
     {
     {
         options.series[0].data= []
         //options.series[0].data= [];
     }
     }
     else if(selVal == 2)
     else if(selVal == 2)
     {
     {
         options.series[0].data= []
         //options.series[0].data= [];
     }
     }
     else if(selVal == 3)
     else if(selVal == 3)
     {
     {
         options.series[0].data= []
         options.series[0].data= [];
     }  
     }  
     else
     else
     {
     {
       options.series[0].data= []
       options.series[0].data= [];
     }   
     }   
     //chart.redraw();
     //chart.redraw();
Line 287: Line 303:
           d > 2  ? '#FED976':
           d > 2  ? '#FED976':
                       '#FFEDA0';
                       '#FFEDA0';
}
function sortByKey(array, key) {
    return array.sort(function(a, b) {
        var x = a[key]; var y = b[key];
        return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    });
}
}


</script>
</script>
<div id="selectbox"><b>Sort by</b>
<!--div id="selectbox"><b>Sort by</b>
<select id="list">
<select id="list">
     <option value="1">peak count</option>
     <option value="1">peak count</option>
     <option value="2">symbol name</option>
     <option value="2">symbol name</option>
</select>
</select>
</div>
</div--!>
<div id="container" style="min-width:250px; height: auto; margin: 0 auto"></div>
<div id="container" style="min-width:250px; height: auto; margin: 0 auto"></div>
<div id='mytoolTip'></div>
<div id='mytoolTip'></div>
</html>
</html>

Latest revision as of 10:44, 2 October 2013