diff options
9 files changed, 143 insertions, 1160 deletions
diff --git a/wqflask/wqflask/correlation_matrix/show_corr_matrix.py b/wqflask/wqflask/correlation_matrix/show_corr_matrix.py index e1df5b24..b670f521 100755 --- a/wqflask/wqflask/correlation_matrix/show_corr_matrix.py +++ b/wqflask/wqflask/correlation_matrix/show_corr_matrix.py @@ -72,7 +72,7 @@ class CorrelationMatrix(object): self.traits = [] for trait_db in self.trait_list: this_trait = trait_db[0] - self.traits.append(this_trait.name) + self.traits.append(this_trait) this_sample_data = this_trait.data for sample in this_sample_data: @@ -96,7 +96,7 @@ class CorrelationMatrix(object): self.sample_data.append(this_trait_vals) self.corr_results = [] - self.corr_rseults_for_pca = [] + self.corr_results_for_pca = [] for trait_db in self.trait_list: this_trait = trait_db[0] this_db = trait_db[1] @@ -115,14 +115,15 @@ class CorrelationMatrix(object): # self.all_sample_list.append(sample) corr_result_row = [] + is_spearman = False #ZS: To determine if it's above or below the diagonal for target in self.trait_list: target_trait = target[0] target_db = target[1] target_samples = target_db.group.samplelist - if this_trait == target_trait and this_db == target_db: - corr_result_row.append(1) - continue + #if this_trait == target_trait and this_db == target_db: + # corr_result_row.append(1) + # continue target_sample_data = target_trait.data print("target_samples", len(target_samples)) @@ -140,9 +141,14 @@ class CorrelationMatrix(object): this_trait_vals, target_vals, num_overlap = corr_result_helpers.normalize_values( this_trait_vals, target_vals) - sample_r, sample_p = scipy.stats.pearsonr(this_trait_vals, target_vals) + if is_spearman == False: + sample_r, sample_p = scipy.stats.pearsonr(this_trait_vals, target_vals) + if sample_r == 1: + is_spearman = True + else: + sample_r, sample_p = scipy.stats.spearmanr(this_trait_vals, target_vals) - corr_result_row.append(sample_r) + corr_result_row.append([target_trait, sample_r, num_overlap]) self.corr_results.append(corr_result_row) @@ -152,15 +158,25 @@ class CorrelationMatrix(object): for sample in self.all_sample_list: groups.append(1) - pca = self.calculate_pca(self.corr_results, range(len(self.traits))) + #pca = self.calculate_pca(self.corr_results, range(len(self.traits))) + - self.js_data = dict(traits = self.traits, + self.js_data = dict(traits = [trait.name for trait in self.traits], groups = groups, cols = range(len(self.traits)), rows = range(len(self.traits)), samples = self.all_sample_list, - sample_data = self.sample_data, - corr_results = self.corr_results,) + sample_data = self.sample_data,) + # corr_results = [result[1] for result in result_row for result_row in self.corr_results]) + + + #self.js_data = dict(traits = self.traits, + # groups = groups, + # cols = range(len(self.traits)), + # rows = range(len(self.traits)), + # samples = self.all_sample_list, + # sample_data = self.sample_data, + # corr_results = self.corr_results,) @@ -194,21 +210,8 @@ class CorrelationMatrix(object): print("eigen:", eigen) pca = stats.princomp(m, cor = "TRUE") print("pca:", pca) + print("loadings:", pca.rx('loadings')) + print("scores:", pca.rx('scores')) + print("scale:", pca.rx('scale')) - return pca - - - - - - - - - - - - - - - - + return pca \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/corr_matrix.js b/wqflask/wqflask/static/new/javascript/corr_matrix.js index df0bef9d..ad0fc8b8 100644 --- a/wqflask/wqflask/static/new/javascript/corr_matrix.js +++ b/wqflask/wqflask/static/new/javascript/corr_matrix.js @@ -31,7 +31,7 @@ iplotCorr = function(data, chartOpts) { ncorrX = data.cols.length; ncorrY = data.rows.length; corXscale = d3.scale.ordinal().domain(d3.range(ncorrX)).rangeBands([0, width]); - corYscale = d3.scale.ordinal().domain(d3.range(ncorrY)).rangeBands([height, 0]); + corYscale = d3.scale.ordinal().domain(d3.range(ncorrY)).rangeBands([0, height]); corZscale = d3.scale.linear().domain(zlim).range(corcolors); pixel_width = corXscale(1) - corXscale(0); pixel_height = corYscale(0) - corYscale(1); @@ -44,12 +44,16 @@ iplotCorr = function(data, chartOpts) { value: data.corr[i][j] }); } + corrplot.append("text").attr("class", "corrlabel_y").attr("y", corYscale(i) - pixel_height / 2).attr("x", -margin.left * 0.1).text(data["var"][data.rows[i]]).attr("dominant-baseline", "middle").attr("text-anchor", "end"); + //corrplot.append("text").attr("class", "corrlabel_x").attr("x", corXscale(i) + pixel_width / 2).attr("y", height + margin.bottom * 0.2).text(data["var"][data.cols[i]]).attr("dominant-baseline", "middle").attr("text-anchor", "middle"); + } scatterplot.append("rect").attr("height", height).attr("width", width).attr("fill", rectcolor).attr("stroke", "black").attr("stroke-width", 1).attr("pointer-events", "none"); corr_tip = d3.tip().attr('class', 'd3-tip').html(function(d) { return d3.format(".2f")(d.value); }).direction('e').offset([0, 10]); corrplot.call(corr_tip); + cells = corrplot.selectAll("empty").data(corr).enter().append("rect").attr("class", "cell").attr("x", function(d) { return corXscale(d.col); }).attr("y", function(d) { @@ -59,11 +63,12 @@ iplotCorr = function(data, chartOpts) { }).attr("stroke", "none").attr("stroke-width", 2).on("mouseover", function(d) { d3.select(this).attr("stroke", "black"); corr_tip.show(d); - corrplot.append("text").attr("class", "corrlabel").attr("x", corXscale(d.col) + pixel_width / 2).attr("y", height + margin.bottom * 0.2).text(data["var"][data.cols[d.col]]).attr("dominant-baseline", "middle").attr("text-anchor", "middle"); - return corrplot.append("text").attr("class", "corrlabel").attr("y", corYscale(d.row) + pixel_height / 2).attr("x", -margin.left * 0.1).text(data["var"][data.rows[d.row]]).attr("dominant-baseline", "middle").attr("text-anchor", "end"); + //corrplot.append("text").attr("class", "corrlabel").attr("x", corXscale(d.col) + pixel_width / 2).attr("y", height + margin.bottom * 0.2).text(data["var"][data.cols[d.col]]).attr("dominant-baseline", "middle").attr("text-anchor", "middle"); + //return corrplot.append("text").attr("class", "corrlabel_x").attr("y", corYscale(d.row) + pixel_height / 2).attr("x", -margin.left * 0.1).text(data["var"][data.rows[d.row]]).attr("dominant-baseline", "middle").attr("text-anchor", "end"); + return corrplot.append("text").attr("class", "corrlabel_x").attr("x", corXscale(d.col) + pixel_width / 2).attr("y", height + margin.bottom * 0.2).text(data["var"][data.cols[d.col]]).attr("dominant-baseline", "middle").attr("text-anchor", "middle"); }).on("mouseout", function(d) { corr_tip.hide(d); - d3.selectAll("text.corrlabel").remove(); + d3.selectAll("text.corrlabel_x").remove(); return d3.select(this).attr("stroke", "none"); }).on("click", function(d) { return drawScatter(d.col, d.row); @@ -135,7 +140,7 @@ iplotCorr = function(data, chartOpts) { var x, y; x = data.dat[data.cols[i]][d]; y = data.dat[data.rows[j]][d]; - if ((x != null) && (y != null)) { + if ((x != "") && (y != "")) { return 3; } else { return null; diff --git a/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css b/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css index c8303de2..931ec6b3 100755 --- a/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css +++ b/wqflask/wqflask/static/new/packages/DataTables/css/jquery.dataTables.css @@ -2,7 +2,7 @@ * Table styles */ table.dataTable { - width: 100%; + //width: 100%; margin: 0 auto; clear: both; border-collapse: separate; diff --git a/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.js b/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.js deleted file mode 100644 index c1f962c4..00000000 --- a/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.js +++ /dev/null @@ -1,1027 +0,0 @@ -/*! FixedHeader 2.1.2 - * ©2010-2014 SpryMedia Ltd - datatables.net/license - */ - -/** - * @summary FixedHeader - * @description Fix a table's header or footer, so it is always visible while - * Scrolling - * @version 2.1.2 - * @file dataTables.fixedHeader.js - * @author SpryMedia Ltd (www.sprymedia.co.uk) - * @contact www.sprymedia.co.uk/contact - * @copyright Copyright 2009-2014 SpryMedia Ltd. - * - * This source file is free software, available under the following license: - * MIT license - http://datatables.net/license/mit - * - * This source file is distributed in the hope that it will be useful, but - * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY - * or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details. - * - * For details please refer to: http://www.datatables.net - */ - -/* Global scope for FixedColumns for backwards compatibility - will be removed - * in future. Not documented in 1.1.x. - */ - -/* Global scope for FixedColumns */ -var FixedHeader; - -(function(window, document, undefined) { - - -var factory = function( $, DataTable ) { -"use strict"; - -/* - * Function: FixedHeader - * Purpose: Provide 'fixed' header, footer and columns for a DataTable - * Returns: object:FixedHeader - must be called with 'new' - * Inputs: mixed:mTable - target table - * @param {object} dt DataTables instance or HTML table node. With DataTables - * 1.10 this can also be a jQuery collection (with just a single table in its - * result set), a jQuery selector, DataTables API instance or settings - * object. - * @param {object} [oInit] initialisation settings, with the following - * properties (each optional) - * * bool:top - fix the header (default true) - * * bool:bottom - fix the footer (default false) - * * int:left - fix the left column(s) (default 0) - * * int:right - fix the right column(s) (default 0) - * * int:zTop - fixed header zIndex - * * int:zBottom - fixed footer zIndex - * * int:zLeft - fixed left zIndex - * * int:zRight - fixed right zIndex - */ -FixedHeader = function ( mTable, oInit ) { - /* Sanity check - you just know it will happen */ - if ( ! this instanceof FixedHeader ) - { - alert( "FixedHeader warning: FixedHeader must be initialised with the 'new' keyword." ); - return; - } - - var that = this; - var oSettings = { - "aoCache": [], - "oSides": { - "top": true, - "bottom": false, - "left": 0, - "right": 0 - }, - "oZIndexes": { - "top": 104, - "bottom": 103, - "left": 102, - "right": 101 - }, - "oCloneOnDraw": { - "top": false, - "bottom": false, - "left": true, - "right": true - }, - "oMes": { - "iTableWidth": 0, - "iTableHeight": 0, - "iTableLeft": 0, - "iTableRight": 0, /* note this is left+width, not actually "right" */ - "iTableTop": 0, - "iTableBottom": 0 /* note this is top+height, not actually "bottom" */ - }, - "oOffset": { - "top": 0 - }, - "nTable": null, - "bFooter": false, - "bInitComplete": false - }; - - /* - * Function: fnGetSettings - * Purpose: Get the settings for this object - * Returns: object: - settings object - * Inputs: - - */ - this.fnGetSettings = function () { - return oSettings; - }; - - /* - * Function: fnUpdate - * Purpose: Update the positioning and copies of the fixed elements - * Returns: - - * Inputs: - - */ - this.fnUpdate = function () { - this._fnUpdateClones(); - this._fnUpdatePositions(); - }; - - /* - * Function: fnPosition - * Purpose: Update the positioning of the fixed elements - * Returns: - - * Inputs: - - */ - this.fnPosition = function () { - this._fnUpdatePositions(); - }; - - - var dt = $.fn.dataTable.Api ? - new $.fn.dataTable.Api( mTable ).settings()[0] : - mTable.fnSettings(); - - dt._oPluginFixedHeader = this; - - /* Let's do it */ - this.fnInit( dt, oInit ); - -}; - - -/* - * Variable: FixedHeader - * Purpose: Prototype for FixedHeader - * Scope: global - */ -FixedHeader.prototype = { - /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Initialisation - */ - - /* - * Function: fnInit - * Purpose: The "constructor" - * Returns: - - * Inputs: {as FixedHeader function} - */ - fnInit: function ( oDtSettings, oInit ) - { - var s = this.fnGetSettings(); - var that = this; - - /* Record the user definable settings */ - this.fnInitSettings( s, oInit ); - - if ( oDtSettings.oScroll.sX !== "" || oDtSettings.oScroll.sY !== "" ) - { - alert( "FixedHeader 2 is not supported with DataTables' scrolling mode at this time" ); - return; - } - - s.nTable = oDtSettings.nTable; - oDtSettings.aoDrawCallback.unshift( { - "fn": function () { - FixedHeader.fnMeasure(); - that._fnUpdateClones.call(that); - that._fnUpdatePositions.call(that); - }, - "sName": "FixedHeader" - } ); - - s.bFooter = ($('>tfoot', s.nTable).length > 0) ? true : false; - - /* Add the 'sides' that are fixed */ - if ( s.oSides.top ) - { - s.aoCache.push( that._fnCloneTable( "fixedHeader", "FixedHeader_Header", that._fnCloneThead ) ); - } - if ( s.oSides.bottom ) - { - s.aoCache.push( that._fnCloneTable( "fixedFooter", "FixedHeader_Footer", that._fnCloneTfoot ) ); - } - if ( s.oSides.left ) - { - s.aoCache.push( that._fnCloneTable( "fixedLeft", "FixedHeader_Left", that._fnCloneTLeft, s.oSides.left ) ); - } - if ( s.oSides.right ) - { - s.aoCache.push( that._fnCloneTable( "fixedRight", "FixedHeader_Right", that._fnCloneTRight, s.oSides.right ) ); - } - - /* Event listeners for window movement */ - FixedHeader.afnScroll.push( function () { - that._fnUpdatePositions.call(that); - } ); - - $(window).resize( function () { - FixedHeader.fnMeasure(); - that._fnUpdateClones.call(that); - that._fnUpdatePositions.call(that); - } ); - - $(s.nTable) - .on('column-reorder.dt', function () { - FixedHeader.fnMeasure(); - that._fnUpdateClones( true ); - that._fnUpdatePositions(); - } ) - .on('column-visibility.dt', function () { - FixedHeader.fnMeasure(); - that._fnUpdateClones( true ); - that._fnUpdatePositions(); - } ); - - /* Get things right to start with */ - FixedHeader.fnMeasure(); - that._fnUpdateClones(); - that._fnUpdatePositions(); - - s.bInitComplete = true; - }, - - - /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Support functions - */ - - /* - * Function: fnInitSettings - * Purpose: Take the user's settings and copy them to our local store - * Returns: - - * Inputs: object:s - the local settings object - * object:oInit - the user's settings object - */ - fnInitSettings: function ( s, oInit ) - { - if ( oInit !== undefined ) - { - if ( oInit.top !== undefined ) { - s.oSides.top = oInit.top; - } - if ( oInit.bottom !== undefined ) { - s.oSides.bottom = oInit.bottom; - } - if ( typeof oInit.left == 'boolean' ) { - s.oSides.left = oInit.left ? 1 : 0; - } - else if ( oInit.left !== undefined ) { - s.oSides.left = oInit.left; - } - if ( typeof oInit.right == 'boolean' ) { - s.oSides.right = oInit.right ? 1 : 0; - } - else if ( oInit.right !== undefined ) { - s.oSides.right = oInit.right; - } - - if ( oInit.zTop !== undefined ) { - s.oZIndexes.top = oInit.zTop; - } - if ( oInit.zBottom !== undefined ) { - s.oZIndexes.bottom = oInit.zBottom; - } - if ( oInit.zLeft !== undefined ) { - s.oZIndexes.left = oInit.zLeft; - } - if ( oInit.zRight !== undefined ) { - s.oZIndexes.right = oInit.zRight; - } - - if ( oInit.offsetTop !== undefined ) { - s.oOffset.top = oInit.offsetTop; - } - if ( oInit.alwaysCloneTop !== undefined ) { - s.oCloneOnDraw.top = oInit.alwaysCloneTop; - } - if ( oInit.alwaysCloneBottom !== undefined ) { - s.oCloneOnDraw.bottom = oInit.alwaysCloneBottom; - } - if ( oInit.alwaysCloneLeft !== undefined ) { - s.oCloneOnDraw.left = oInit.alwaysCloneLeft; - } - if ( oInit.alwaysCloneRight !== undefined ) { - s.oCloneOnDraw.right = oInit.alwaysCloneRight; - } - } - }, - - /* - * Function: _fnCloneTable - * Purpose: Clone the table node and do basic initialisation - * Returns: - - * Inputs: - - */ - _fnCloneTable: function ( sType, sClass, fnClone, iCells ) - { - var s = this.fnGetSettings(); - var nCTable; - - /* We know that the table _MUST_ has a DIV wrapped around it, because this is simply how - * DataTables works. Therefore, we can set this to be relatively position (if it is not - * alreadu absolute, and use this as the base point for the cloned header - */ - if ( $(s.nTable.parentNode).css('position') != "absolute" ) - { - s.nTable.parentNode.style.position = "relative"; - } - - /* Just a shallow clone will do - we only want the table node */ - nCTable = s.nTable.cloneNode( false ); - nCTable.removeAttribute( 'id' ); - - var nDiv = document.createElement( 'div' ); - nDiv.style.position = "absolute"; - nDiv.style.top = "0px"; - nDiv.style.left = "0px"; - nDiv.className += " FixedHeader_Cloned "+sType+" "+sClass; - - /* Set the zIndexes */ - if ( sType == "fixedHeader" ) - { - nDiv.style.zIndex = s.oZIndexes.top; - } - if ( sType == "fixedFooter" ) - { - nDiv.style.zIndex = s.oZIndexes.bottom; - } - if ( sType == "fixedLeft" ) - { - nDiv.style.zIndex = s.oZIndexes.left; - } - else if ( sType == "fixedRight" ) - { - nDiv.style.zIndex = s.oZIndexes.right; - } - - /* remove margins since we are going to position it absolutely */ - nCTable.style.margin = "0"; - - /* Insert the newly cloned table into the DOM, on top of the "real" header */ - nDiv.appendChild( nCTable ); - document.body.appendChild( nDiv ); - - return { - "nNode": nCTable, - "nWrapper": nDiv, - "sType": sType, - "sPosition": "", - "sTop": "", - "sLeft": "", - "fnClone": fnClone, - "iCells": iCells - }; - }, - - /* - * Function: _fnMeasure - * Purpose: Get the current positioning of the table in the DOM - * Returns: - - * Inputs: - - */ - _fnMeasure: function () - { - var - s = this.fnGetSettings(), - m = s.oMes, - jqTable = $(s.nTable), - oOffset = jqTable.offset(), - iParentScrollTop = this._fnSumScroll( s.nTable.parentNode, 'scrollTop' ), - iParentScrollLeft = this._fnSumScroll( s.nTable.parentNode, 'scrollLeft' ); - - m.iTableWidth = jqTable.outerWidth(); - m.iTableHeight = jqTable.outerHeight(); - m.iTableLeft = oOffset.left + s.nTable.parentNode.scrollLeft; - m.iTableTop = oOffset.top + iParentScrollTop; - m.iTableRight = m.iTableLeft + m.iTableWidth; - m.iTableRight = FixedHeader.oDoc.iWidth - m.iTableLeft - m.iTableWidth; - m.iTableBottom = FixedHeader.oDoc.iHeight - m.iTableTop - m.iTableHeight; - }, - - /* - * Function: _fnSumScroll - * Purpose: Sum node parameters all the way to the top - * Returns: int: sum - * Inputs: node:n - node to consider - * string:side - scrollTop or scrollLeft - */ - _fnSumScroll: function ( n, side ) - { - var i = n[side]; - while ( n = n.parentNode ) - { - if ( n.nodeName == 'HTML' || n.nodeName == 'BODY' ) - { - break; - } - i = n[side]; - } - return i; - }, - - /* - * Function: _fnUpdatePositions - * Purpose: Loop over the fixed elements for this table and update their positions - * Returns: - - * Inputs: - - */ - _fnUpdatePositions: function () - { - var s = this.fnGetSettings(); - this._fnMeasure(); - - for ( var i=0, iLen=s.aoCache.length ; i<iLen ; i++ ) - { - if ( s.aoCache[i].sType == "fixedHeader" ) - { - this._fnScrollFixedHeader( s.aoCache[i] ); - } - else if ( s.aoCache[i].sType == "fixedFooter" ) - { - this._fnScrollFixedFooter( s.aoCache[i] ); - } - else if ( s.aoCache[i].sType == "fixedLeft" ) - { - this._fnScrollHorizontalLeft( s.aoCache[i] ); - } - else - { - this._fnScrollHorizontalRight( s.aoCache[i] ); - } - } - }, - - /* - * Function: _fnUpdateClones - * Purpose: Loop over the fixed elements for this table and call their cloning functions - * Returns: - - * Inputs: - - */ - _fnUpdateClones: function ( full ) - { - var s = this.fnGetSettings(); - - if ( full ) { - // This is a little bit of a hack to force a full clone draw. When - // `full` is set to true, we want to reclone the source elements, - // regardless of the clone-on-draw settings - s.bInitComplete = false; - } - - for ( var i=0, iLen=s.aoCache.length ; i<iLen ; i++ ) - { - s.aoCache[i].fnClone.call( this, s.aoCache[i] ); - } - - if ( full ) { - s.bInitComplete = true; - } - }, - - - /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Scrolling functions - */ - - /* - * Function: _fnScrollHorizontalLeft - * Purpose: Update the positioning of the scrolling elements - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnScrollHorizontalRight: function ( oCache ) - { - var - s = this.fnGetSettings(), - oMes = s.oMes, - oWin = FixedHeader.oWin, - oDoc = FixedHeader.oDoc, - nTable = oCache.nWrapper, - iFixedWidth = $(nTable).outerWidth(); - - if ( oWin.iScrollRight < oMes.iTableRight ) - { - /* Fully right aligned */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', oMes.iTableTop+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', (oMes.iTableLeft+oMes.iTableWidth-iFixedWidth)+"px", 'left', nTable.style ); - } - else if ( oMes.iTableLeft < oDoc.iWidth-oWin.iScrollRight-iFixedWidth ) - { - /* Middle */ - this._fnUpdateCache( oCache, 'sPosition', 'fixed', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oMes.iTableTop-oWin.iScrollTop)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', (oWin.iWidth-iFixedWidth)+"px", 'left', nTable.style ); - } - else - { - /* Fully left aligned */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', oMes.iTableTop+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - }, - - /* - * Function: _fnScrollHorizontalLeft - * Purpose: Update the positioning of the scrolling elements - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnScrollHorizontalLeft: function ( oCache ) - { - var - s = this.fnGetSettings(), - oMes = s.oMes, - oWin = FixedHeader.oWin, - oDoc = FixedHeader.oDoc, - nTable = oCache.nWrapper, - iCellWidth = $(nTable).outerWidth(); - - if ( oWin.iScrollLeft < oMes.iTableLeft ) - { - /* Fully left align */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', oMes.iTableTop+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - else if ( oWin.iScrollLeft < oMes.iTableLeft+oMes.iTableWidth-iCellWidth ) - { - this._fnUpdateCache( oCache, 'sPosition', 'fixed', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oMes.iTableTop-oWin.iScrollTop)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', "0px", 'left', nTable.style ); - } - else - { - /* Fully right align */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', oMes.iTableTop+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', (oMes.iTableLeft+oMes.iTableWidth-iCellWidth)+"px", 'left', nTable.style ); - } - }, - - /* - * Function: _fnScrollFixedFooter - * Purpose: Update the positioning of the scrolling elements - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnScrollFixedFooter: function ( oCache ) - { - var - s = this.fnGetSettings(), - oMes = s.oMes, - oWin = FixedHeader.oWin, - oDoc = FixedHeader.oDoc, - nTable = oCache.nWrapper, - iTheadHeight = $("thead", s.nTable).outerHeight(), - iCellHeight = $(nTable).outerHeight(); - - if ( oWin.iScrollBottom < oMes.iTableBottom ) - { - /* Below */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oMes.iTableTop+oMes.iTableHeight-iCellHeight)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - else if ( oWin.iScrollBottom < oMes.iTableBottom+oMes.iTableHeight-iCellHeight-iTheadHeight ) - { - this._fnUpdateCache( oCache, 'sPosition', 'fixed', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oWin.iHeight-iCellHeight)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', (oMes.iTableLeft-oWin.iScrollLeft)+"px", 'left', nTable.style ); - } - else - { - /* Above */ - this._fnUpdateCache( oCache, 'sPosition', 'absolute', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oMes.iTableTop+iCellHeight)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - }, - - /* - * Function: _fnScrollFixedHeader - * Purpose: Update the positioning of the scrolling elements - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnScrollFixedHeader: function ( oCache ) - { - var - s = this.fnGetSettings(), - oMes = s.oMes, - oWin = FixedHeader.oWin, - oDoc = FixedHeader.oDoc, - nTable = oCache.nWrapper, - iTbodyHeight = 0, - anTbodies = s.nTable.getElementsByTagName('tbody'); - - for (var i = 0; i < anTbodies.length; ++i) { - iTbodyHeight += anTbodies[i].offsetHeight; - } - - if ( oMes.iTableTop > oWin.iScrollTop + s.oOffset.top ) - { - /* Above the table */ - this._fnUpdateCache( oCache, 'sPosition', "absolute", 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', oMes.iTableTop+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - else if ( oWin.iScrollTop + s.oOffset.top > oMes.iTableTop+iTbodyHeight ) - { - /* At the bottom of the table */ - this._fnUpdateCache( oCache, 'sPosition', "absolute", 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', (oMes.iTableTop+iTbodyHeight)+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', oMes.iTableLeft+"px", 'left', nTable.style ); - } - else - { - /* In the middle of the table */ - this._fnUpdateCache( oCache, 'sPosition', 'fixed', 'position', nTable.style ); - this._fnUpdateCache( oCache, 'sTop', s.oOffset.top+"px", 'top', nTable.style ); - this._fnUpdateCache( oCache, 'sLeft', (oMes.iTableLeft-oWin.iScrollLeft)+"px", 'left', nTable.style ); - } - }, - - /* - * Function: _fnUpdateCache - * Purpose: Check the cache and update cache and value if needed - * Returns: - - * Inputs: object:oCache - local cache object - * string:sCache - cache property - * string:sSet - value to set - * string:sProperty - object property to set - * object:oObj - object to update - */ - _fnUpdateCache: function ( oCache, sCache, sSet, sProperty, oObj ) - { - if ( oCache[sCache] != sSet ) - { - oObj[sProperty] = sSet; - oCache[sCache] = sSet; - } - }, - - - - /** - * Copy the classes of all child nodes from one element to another. This implies - * that the two have identical structure - no error checking is performed to that - * fact. - * @param {element} source Node to copy classes from - * @param {element} dest Node to copy classes too - */ - _fnClassUpdate: function ( source, dest ) - { - var that = this; - - if ( source.nodeName.toUpperCase() === "TR" || source.nodeName.toUpperCase() === "TH" || - source.nodeName.toUpperCase() === "TD" || source.nodeName.toUpperCase() === "SPAN" ) - { - dest.className = source.className; - } - - $(source).children().each( function (i) { - that._fnClassUpdate( $(source).children()[i], $(dest).children()[i] ); - } ); - }, - - - /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Cloning functions - */ - - /* - * Function: _fnCloneThead - * Purpose: Clone the thead element - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnCloneThead: function ( oCache ) - { - var s = this.fnGetSettings(); - var nTable = oCache.nNode; - - if ( s.bInitComplete && !s.oCloneOnDraw.top ) - { - this._fnClassUpdate( $('thead', s.nTable)[0], $('thead', nTable)[0] ); - return; - } - - /* Set the wrapper width to match that of the cloned table */ - var iDtWidth = $(s.nTable).outerWidth(); - oCache.nWrapper.style.width = iDtWidth+"px"; - nTable.style.width = iDtWidth+"px"; - - /* Remove any children the cloned table has */ - while ( nTable.childNodes.length > 0 ) - { - $('thead th', nTable).unbind( 'click' ); - nTable.removeChild( nTable.childNodes[0] ); - } - - /* Clone the DataTables header */ - var nThead = $('thead', s.nTable).clone(true)[0]; - nTable.appendChild( nThead ); - - /* Copy the widths across - apparently a clone isn't good enough for this */ - var a = []; - var b = []; - - $("thead>tr th", s.nTable).each( function (i) { - a.push( $(this).width() ); - } ); - - $("thead>tr td", s.nTable).each( function (i) { - b.push( $(this).width() ); - } ); - - $("thead>tr th", s.nTable).each( function (i) { - $("thead>tr th:eq("+i+")", nTable).width( a[i] ); - $(this).width( a[i] ); - } ); - - $("thead>tr td", s.nTable).each( function (i) { - $("thead>tr td:eq("+i+")", nTable).width( b[i] ); - $(this).width( b[i] ); - } ); - - // Stop DataTables 1.9 from putting a focus ring on the headers when - // clicked to sort - $('th.sorting, th.sorting_desc, th.sorting_asc', nTable).bind( 'click', function () { - this.blur(); - } ); - }, - - /* - * Function: _fnCloneTfoot - * Purpose: Clone the tfoot element - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnCloneTfoot: function ( oCache ) - { - var s = this.fnGetSettings(); - var nTable = oCache.nNode; - - /* Set the wrapper width to match that of the cloned table */ - oCache.nWrapper.style.width = $(s.nTable).outerWidth()+"px"; - - /* Remove any children the cloned table has */ - while ( nTable.childNodes.length > 0 ) - { - nTable.removeChild( nTable.childNodes[0] ); - } - - /* Clone the DataTables footer */ - var nTfoot = $('tfoot', s.nTable).clone(true)[0]; - nTable.appendChild( nTfoot ); - - /* Copy the widths across - apparently a clone isn't good enough for this */ - $("tfoot:eq(0)>tr th", s.nTable).each( function (i) { - $("tfoot:eq(0)>tr th:eq("+i+")", nTable).width( $(this).width() ); - } ); - - $("tfoot:eq(0)>tr td", s.nTable).each( function (i) { - $("tfoot:eq(0)>tr td:eq("+i+")", nTable).width( $(this).width() ); - } ); - }, - - /* - * Function: _fnCloneTLeft - * Purpose: Clone the left column(s) - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnCloneTLeft: function ( oCache ) - { - var s = this.fnGetSettings(); - var nTable = oCache.nNode; - var nBody = $('tbody', s.nTable)[0]; - - /* Remove any children the cloned table has */ - while ( nTable.childNodes.length > 0 ) - { - nTable.removeChild( nTable.childNodes[0] ); - } - - /* Is this the most efficient way to do this - it looks horrible... */ - nTable.appendChild( $("thead", s.nTable).clone(true)[0] ); - nTable.appendChild( $("tbody", s.nTable).clone(true)[0] ); - if ( s.bFooter ) - { - nTable.appendChild( $("tfoot", s.nTable).clone(true)[0] ); - } - - /* Remove unneeded cells */ - var sSelector = 'gt(' + (oCache.iCells - 1) + ')'; - $('thead tr', nTable).each( function (k) { - $('th:' + sSelector, this).remove(); - } ); - - $('tfoot tr', nTable).each( function (k) { - $('th:' + sSelector, this).remove(); - } ); - - $('tbody tr', nTable).each( function (k) { - $('td:' + sSelector, this).remove(); - } ); - - this.fnEqualiseHeights( 'thead', nBody.parentNode, nTable ); - this.fnEqualiseHeights( 'tbody', nBody.parentNode, nTable ); - this.fnEqualiseHeights( 'tfoot', nBody.parentNode, nTable ); - - var iWidth = 0; - for (var i = 0; i < oCache.iCells; i++) { - iWidth += $('thead tr th:eq(' + i + ')', s.nTable).outerWidth(); - } - nTable.style.width = iWidth+"px"; - oCache.nWrapper.style.width = iWidth+"px"; - }, - - /* - * Function: _fnCloneTRight - * Purpose: Clone the right most column(s) - * Returns: - - * Inputs: object:oCache - the cached values for this fixed element - */ - _fnCloneTRight: function ( oCache ) - { - var s = this.fnGetSettings(); - var nBody = $('tbody', s.nTable)[0]; - var nTable = oCache.nNode; - var iCols = $('tbody tr:eq(0) td', s.nTable).length; - - /* Remove any children the cloned table has */ - while ( nTable.childNodes.length > 0 ) - { - nTable.removeChild( nTable.childNodes[0] ); - } - - /* Is this the most efficient way to do this - it looks horrible... */ - nTable.appendChild( $("thead", s.nTable).clone(true)[0] ); - nTable.appendChild( $("tbody", s.nTable).clone(true)[0] ); - if ( s.bFooter ) - { - nTable.appendChild( $("tfoot", s.nTable).clone(true)[0] ); - } - $('thead tr th:lt('+(iCols-oCache.iCells)+')', nTable).remove(); - $('tfoot tr th:lt('+(iCols-oCache.iCells)+')', nTable).remove(); - - /* Remove unneeded cells */ - $('tbody tr', nTable).each( function (k) { - $('td:lt('+(iCols-oCache.iCells)+')', this).remove(); - } ); - - this.fnEqualiseHeights( 'thead', nBody.parentNode, nTable ); - this.fnEqualiseHeights( 'tbody', nBody.parentNode, nTable ); - this.fnEqualiseHeights( 'tfoot', nBody.parentNode, nTable ); - - var iWidth = 0; - for (var i = 0; i < oCache.iCells; i++) { - iWidth += $('thead tr th:eq('+(iCols-1-i)+')', s.nTable).outerWidth(); - } - nTable.style.width = iWidth+"px"; - oCache.nWrapper.style.width = iWidth+"px"; - }, - - - /** - * Equalise the heights of the rows in a given table node in a cross browser way. Note that this - * is more or less lifted as is from FixedColumns - * @method fnEqualiseHeights - * @returns void - * @param {string} parent Node type - thead, tbody or tfoot - * @param {element} original Original node to take the heights from - * @param {element} clone Copy the heights to - * @private - */ - "fnEqualiseHeights": function ( parent, original, clone ) - { - var that = this; - var originals = $(parent +' tr', original); - var height; - - $(parent+' tr', clone).each( function (k) { - height = originals.eq( k ).css('height'); - - // This is nasty :-(. IE has a sub-pixel error even when setting - // the height below (the Firefox fix) which causes the fixed column - // to go out of alignment. Need to add a pixel before the assignment - // Can this be feature detected? Not sure how... - if ( navigator.appName == 'Microsoft Internet Explorer' ) { - height = parseInt( height, 10 ) + 1; - } - - $(this).css( 'height', height ); - - // For Firefox to work, we need to also set the height of the - // original row, to the value that we read from it! Otherwise there - // is a sub-pixel rounding error - originals.eq( k ).css( 'height', height ); - } ); - } -}; - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Static properties and methods - * We use these for speed! This information is common to all instances of FixedHeader, so no - * point if having them calculated and stored for each different instance. - */ - -/* - * Variable: oWin - * Purpose: Store information about the window positioning - * Scope: FixedHeader - */ -FixedHeader.oWin = { - "iScrollTop": 0, - "iScrollRight": 0, - "iScrollBottom": 0, - "iScrollLeft": 0, - "iHeight": 0, - "iWidth": 0 -}; - -/* - * Variable: oDoc - * Purpose: Store information about the document size - * Scope: FixedHeader - */ -FixedHeader.oDoc = { - "iHeight": 0, - "iWidth": 0 -}; - -/* - * Variable: afnScroll - * Purpose: Array of functions that are to be used for the scrolling components - * Scope: FixedHeader - */ -FixedHeader.afnScroll = []; - -/* - * Function: fnMeasure - * Purpose: Update the measurements for the window and document - * Returns: - - * Inputs: - - */ -FixedHeader.fnMeasure = function () -{ - var - jqWin = $(window), - jqDoc = $(document), - oWin = FixedHeader.oWin, - oDoc = FixedHeader.oDoc; - - oDoc.iHeight = jqDoc.height(); - oDoc.iWidth = jqDoc.width(); - - oWin.iHeight = jqWin.height(); - oWin.iWidth = jqWin.width(); - oWin.iScrollTop = jqWin.scrollTop(); - oWin.iScrollLeft = jqWin.scrollLeft(); - oWin.iScrollRight = oDoc.iWidth - oWin.iScrollLeft - oWin.iWidth; - oWin.iScrollBottom = oDoc.iHeight - oWin.iScrollTop - oWin.iHeight; -}; - - -FixedHeader.version = "2.1.2"; - - -/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - * Global processing - */ - -/* - * Just one 'scroll' event handler in FixedHeader, which calls the required components. This is - * done as an optimisation, to reduce calculation and proagation time - */ -$(window).scroll( function () { - FixedHeader.fnMeasure(); - - for ( var i=0, iLen=FixedHeader.afnScroll.length ; i<iLen ; i++ ) { - FixedHeader.afnScroll[i](); - } -} ); - - -$.fn.dataTable.FixedHeader = FixedHeader; -$.fn.DataTable.FixedHeader = FixedHeader; - - -return FixedHeader; -}; // /factory - - -// Define as an AMD module if possible -if ( typeof define === 'function' && define.amd ) { - define( ['jquery', 'datatables'], factory ); -} -else if ( typeof exports === 'object' ) { - // Node/CommonJS - factory( require('jquery'), require('datatables') ); -} -else if ( jQuery && !jQuery.fn.dataTable.FixedHeader ) { - // Otherwise simply initialise as normal, stopping multiple evaluation - factory( jQuery, jQuery.fn.dataTable ); -} - - -})(window, document); diff --git a/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.min.js b/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.min.js new file mode 100644 index 00000000..e8d19608 --- /dev/null +++ b/wqflask/wqflask/static/new/packages/DataTables/extensions/dataTables.fixedHeader.min.js @@ -0,0 +1,14 @@ +/*! + FixedHeader 3.0.0 + ©2009-2015 SpryMedia Ltd - datatables.net/license +*/ +(function(h,j){var g=function(e,i){var g=0,f=function(b,a){if(!(this instanceof f))throw"FixedHeader must be initialised with the 'new' keyword.";!0===a&&(a={});b=new i.Api(b);this.c=e.extend(!0,{},f.defaults,a);this.s={dt:b,position:{theadTop:0,tbodyTop:0,tfootTop:0,tfootBottom:0,width:0,left:0,tfootHeight:0,theadHeight:0,windowHeight:e(h).height(),visible:!0},headerMode:null,footerMode:null,namespace:".dtfc"+g++};this.dom={floatingHeader:null,thead:e(b.table().header()),tbody:e(b.table().body()), +tfoot:e(b.table().footer()),header:{host:null,floating:null,placeholder:null},footer:{host:null,floating:null,placeholder:null}};this.dom.header.host=this.dom.thead.parent();this.dom.footer.host=this.dom.tfoot.parent();var c=b.settings()[0];if(c._fixedHeader)throw"FixedHeader already initialised on table "+c.nTable.id;c._fixedHeader=this;this._constructor()};f.prototype={update:function(){this._positions();this._scroll(!0)},_constructor:function(){var b=this,a=this.s.dt;e(h).on("scroll"+this.s.namespace, +function(){b._scroll()}).on("resize"+this.s.namespace,function(){b.s.position.windowHeight=e(h).height();b._positions();b._scroll(!0)});a.on("column-reorder.dt.dtfc column-visibility.dt.dtfc",function(){b._positions();b._scroll(!0)}).on("draw.dtfc",function(){b._positions();b._scroll()});a.on("destroy.dtfc",function(){a.off(".dtfc");e(h).off(this.s.namespace)});this._positions();this._scroll()},_clone:function(b,a){var c=this.s.dt,d=this.dom[b],k="header"===b?this.dom.thead:this.dom.tfoot;!a&&d.floating? +d.floating.removeClass("fixedHeader-floating fixedHeader-locked"):(d.floating&&(d.placeholder.remove(),d.floating.children().detach(),d.floating.remove()),d.floating=e(c.table().node().cloneNode(!1)).removeAttr("id").append(k).appendTo("body"),d.placeholder=k.clone(!1),d.host.append(d.placeholder),"footer"===b&&this._footerMatch(d.placeholder,d.floating))},_footerMatch:function(b,a){var c=function(d){var c=e(d,b).map(function(){return e(this).width()}).toArray();e(d,a).each(function(a){e(this).width(c[a])})}; +c("th");c("td")},_footerUnsize:function(){var b=this.dom.footer.floating;b&&e("th, td",b).css("width","")},_modeChange:function(b,a,c){var d=this.dom[a],e=this.s.position;"in-place"===b?(d.placeholder&&(d.placeholder.remove(),d.placeholder=null),d.host.append("header"===a?this.dom.thead:this.dom.tfoot),d.floating&&(d.floating.remove(),d.floating=null),"footer"===a&&this._footerUnsize()):"in"===b?(this._clone(a,c),d.floating.addClass("fixedHeader-floating").css("header"===a?"top":"bottom",this.c[a+ +"Offset"]).css("left",e.left+"px").css("width",e.width+"px"),"footer"===a&&d.floating.css("top","")):"below"===b?(this._clone(a,c),d.floating.addClass("fixedHeader-locked").css("top",e.tfootTop-e.theadHeight).css("left",e.left+"px").css("width",e.width+"px")):"above"===b&&(this._clone(a,c),d.floating.addClass("fixedHeader-locked").css("top",e.tbodyTop).css("left",e.left+"px").css("width",e.width+"px"));this.s[a+"Mode"]=b},_positions:function(){var b=this.s.dt.table(),a=this.s.position,c=this.dom, +b=e(b.node()),d=b.children("thead"),f=b.children("tfoot"),c=c.tbody;a.visible=b.is(":visible");a.width=b.outerWidth();a.left=b.offset().left;a.theadTop=d.offset().top;a.tbodyTop=c.offset().top;a.theadHeight=a.tbodyTop-a.theadTop;f.length?(a.tfootTop=f.offset().top,a.tfootBottom=a.tfootTop+f.outerHeight(),a.tfootHeight=a.tfootBottom-a.tfootTop):(a.tfootTop=a.tbodyTop+c.outerHeight(),a.tfootBottom=a.tfootTop,a.tfootHeight=a.tfootTop)},_scroll:function(b){var a=e(j).scrollTop(),c=this.s.position,d;this.c.header&& +(d=!c.visible||a<=c.theadTop-this.c.headerOffset?"in-place":a<=c.tfootTop-c.theadHeight-this.c.headerOffset?"in":"below",(b||d!==this.s.headerMode)&&this._modeChange(d,"header",b));this.c.footer&&this.dom.tfoot.length&&(a=!c.visible||a+c.windowHeight>=c.tfootBottom+this.c.footerOffset?"in-place":c.windowHeight+a>c.tbodyTop+c.tfootHeight+this.c.footerOffset?"in":"above",(b||a!==this.s.footerMode)&&this._modeChange(a,"footer",b))}};f.version="3.0.0";f.defaults={header:!0,footer:!1,headerOffset:0,footerOffset:0}; +e.fn.dataTable.FixedHeader=f;e.fn.DataTable.FixedHeader=f;e(j).on("init.dt.dtb",function(b,a){if("dt"===b.namespace){var c=a.oInit.fixedHeader||i.defaults.fixedHeader;c&&!a._buttons&&new f(a,c)}});i.Api.register("fixedHeader()",function(){});i.Api.register("fixedHeader.adjust()",function(){return this.iterator("table",function(b){(b=b._fixedHeader)&&b.update()})});return f};"function"===typeof define&&define.amd?define(["jquery","datatables"],g):"object"===typeof exports?g(require("jquery"),require("datatables")): +jQuery&&!jQuery.fn.dataTable.FixedHeader&&g(jQuery,jQuery.fn.dataTable)})(window,document); diff --git a/wqflask/wqflask/static/packages/bootstrap/css/bootstrap.css b/wqflask/wqflask/static/packages/bootstrap/css/bootstrap.css index 4145e73f..461fd089 100755 --- a/wqflask/wqflask/static/packages/bootstrap/css/bootstrap.css +++ b/wqflask/wqflask/static/packages/bootstrap/css/bootstrap.css @@ -2072,8 +2072,8 @@ th { text-align: left; } .table { - width: 100%; - max-width: 100%; + //width: 100%; + //max-width: 100%; margin-bottom: 20px; } .table > thead > tr > th, diff --git a/wqflask/wqflask/templates/correlation_matrix.html b/wqflask/wqflask/templates/correlation_matrix.html index 403d2a98..edc2028f 100755 --- a/wqflask/wqflask/templates/correlation_matrix.html +++ b/wqflask/wqflask/templates/correlation_matrix.html @@ -1,76 +1,70 @@ -{% extends "base.html" %} -{% block css %} - <link rel="stylesheet" type="text/css" href="/static/packages/jqplot/jquery.jqplot.min.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/packages/DataTables/css/jquery.dataTables.css" /> - <link rel="stylesheet" type="text/css" href="/static/packages/DT_bootstrap/DT_bootstrap.css" /> - <link rel="stylesheet" type="text/css" href="/static/packages/TableTools/media/css/TableTools.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/corr_matrix.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> -{% endblock %} -{% block content %} - - {{ header("Correlation Matrix") }} - - <div class="container"> - <div id="chart"></div> -<!-- <div class="row-fluid show-grid"> - <div class="col-md-12"> Pearon's R </div> - </div> - <div class="row-fluid show-grid"> - <div class="col-md-1 col-md-pull-11"> - Spearman's Rho - </div> - <div class="col-md-11 col-md-push-1"> - - <div class="table-responsive"> - <table class="table"> - <th> - {% for key in corr_results %} - <td> - <b>{{ key }}</b> - </td> - {% endfor %} - </th> - {% for key in corr_results %} - <tr> - <td><b>{{ key }}</b></td> - {% for trait in corr_results[key] %} - {% if corr_results[key][trait].sample_r != 1 %} - <td><a target="_blank" href="corr_scatter_plot?dataset_1={{corr_results[key][trait].this_db}}&dataset_2={{corr_results[key][trait].target_db}}&trait_1={{corr_results[key][trait].this_trait}}&trait_2={{corr_results[key][trait].target_trait}}">{{ corr_results[key][trait].sample_r }}</a> - <br> - {{ corr_results[key][trait].num_overlap }}</td> - - {% else %} - <td bgcolor="#E6E6E6"> 1 </td> - {% endif %} - {% endfor %} - {% endfor %} - </tr> - </table> - </div> - - </div> - </div>--> - </div> - -{% endblock %} - -{% block js %} - - <script> - js_data = {{ js_data | safe }} - </script> - - <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> - <script type="text/javascript" src="/static/new/js_external/d3-tip.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.dataTables.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> - <script language="javascript" type="text/javascript" src="/static/packages/underscore/underscore-min.js"></script> - <script type="text/javascript" src="/static/new/javascript/panelutil.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/corr_matrix.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/javascript/create_corr_matrix.js"></script> - -{% endblock %} +{% extends "base.html" %} +{% block css %} + <link rel="stylesheet" type="text/css" href="/static/packages/jqplot/jquery.jqplot.min.css" /> + <link rel="stylesheet" type="text/css" href="/static/new/packages/DataTables/css/jquery.dataTables.css" /> + <link rel="stylesheet" type="text/css" href="/static/packages/DT_bootstrap/DT_bootstrap.css" /> + <link rel="stylesheet" type="text/css" href="/static/packages/TableTools/media/css/TableTools.css" /> + <link rel="stylesheet" type="text/css" href="/static/new/css/corr_matrix.css" /> + <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> + <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> +{% endblock %} +{% block content %} + + {{ header("Correlation Matrix") }} + + + +<table class="collap" border="1" cellpadding="5" cellspacing="1" width="100%"> + <tbody> + <tr> + <td></td> + <td align="center" colspan="11">Spearman Rank Correlation (rho)</td> + </tr> + <tr> + <td align="center" rowspan="11" width="10">P e a r s o n r</td> + <td width="300"></td> + {% for trait in traits %} + <td align="center"><a href="/show_trait?trait_id={{ trait.name }}&dataset={{ trait.dataset.name }}">Trait{{ loop.index }}</a></td> + {% endfor %} + </tr> + {% for trait in traits %} + <tr> + <td><a href="/show_trait?trait_id={{ trait.name }}&dataset={{ trait.dataset.name }}">Trait {{ loop.index }}: {{ trait.dataset.name }}::{{ trait.name }}</a><div id="shortName_0" style="display:none">Symbol: {{ trait.symbol }} </div><div id="verboseName_0" style="display:none">{{ trait_symbol }} on Chr {{ trait.chr }} @ {{ trait.mb }} Mb</div><div id="verboseName2_0" style="display:none">{{ trait.description }}</div><div id="verboseName3_0" style="display:none">{{ trait.probe_target_description }}</div></td> + {% for result in corr_results[loop.index-1] %} + {% if result[0].name == trait.name %} + <td nowrap="ON" align="center"><a href="/show_trait?trait_id={{ trait.name }}&dataset={{ trait.dataset.name }}"><font><em>n</em><br>{{ result[2] }}</font></a></td> + {% else %} + <td nowrap="ON" align="middle"><a href="/corr_scatter_plot?dataset_1={{ trait.dataset.name }}&dataset_2={{ result[0].dataset.name }}&trait_1={{ trait.name }}&trait_2={{ result[0].name }}"><font>{{ '%0.3f' % result[1] }}<br>{{ result[2] }}</font></a></td> + {% endif %} + {% endfor %} + </tr> + {% endfor %} + </tbody> +</table> + +<!-- +<div class="container"> + <div id="chart"></div> +</div> +--> + +{% endblock %} + +{% block js %} + + <script> + js_data = {{ js_data | safe }} + </script> + + <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> + <script type="text/javascript" src="/static/new/js_external/d3-tip.min.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.dataTables.min.js"></script> + <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> + <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> + <script language="javascript" type="text/javascript" src="/static/packages/underscore/underscore-min.js"></script> + <script type="text/javascript" src="/static/new/javascript/panelutil.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/corr_matrix.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/create_corr_matrix.js"></script> + +{% endblock %} diff --git a/wqflask/wqflask/templates/gsearch_gene.html b/wqflask/wqflask/templates/gsearch_gene.html index c7e50a16..0a1839a1 100755 --- a/wqflask/wqflask/templates/gsearch_gene.html +++ b/wqflask/wqflask/templates/gsearch_gene.html @@ -26,7 +26,7 @@ <br /> <br /> - <table class="table table-hover table-striped" id="trait_table"> + <table width="2000px" class="table table-hover table-striped" id="trait_table"> <thead> <tr> <th style="width: 30px;"></th> @@ -80,8 +80,6 @@ <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.naturalSort.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colReorder.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colResize.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.fixedHeader.js"></script> - <script language="javascript" type="text/javascript" src="//cdn.datatables.net/fixedcolumns/3.0.4/js/dataTables.fixedColumns.min.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> @@ -156,23 +154,23 @@ $('#trait_table').DataTable( { "columns": [ { "type": "natural" }, - { "type": "natural", "width": "35%" }, - { "type": "natural", "width": "15%" }, + { "type": "natural" }, + { "type": "natural" }, { "type": "cust-txt" }, - { "type": "natural", "width": "12%" }, - { "type": "natural", "width": "12%" }, - { "type": "natural", "width": "12%" }, - { "type": "natural", "width": "12%" }, - { "type": "natural", "width": "12%" }, + { "type": "natural" }, + { "type": "natural" }, + { "type": "natural" }, + { "type": "natural" }, { "type": "natural", "width": "15%" }, { "type": "natural" }, { "type": "natural" }, + { "type": "natural" }, { "type": "natural" }, { "type": "cust-txt" } ], "order": [[ 1, "asc" ]], "sDom": "RZtir", - "autoWidth": true, + "autoWidth": false, "bLengthChange": true, "bDeferRender": true, "scrollCollapse": false, @@ -181,6 +179,7 @@ }, "paging": false } ); + console.timeEnd("Creating table"); }); diff --git a/wqflask/wqflask/templates/gsearch_pheno.html b/wqflask/wqflask/templates/gsearch_pheno.html index e1dcf76f..2527bebf 100755 --- a/wqflask/wqflask/templates/gsearch_pheno.html +++ b/wqflask/wqflask/templates/gsearch_pheno.html @@ -25,7 +25,7 @@ <input type="text" id="select_top" class="form-control" style="width: 200px; display: inline;" placeholder="Select Top ..."> <br /> <br /> - <table class="table table-hover table-striped" id='trait_table' style="float: left;"> + <table class="table table-hover table-striped" id='trait_table' style="float: left;"> <thead> <tr> <th style="width: 30px;"></th> @@ -71,10 +71,8 @@ <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.dataTables.min.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/dataTables.naturalSort.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colResize2.js"></script> <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colReorder.js"></script> - <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.fixedHeader.js"></script> - <script language="javascript" type="text/javascript" src="//cdn.datatables.net/fixedcolumns/3.0.4/js/dataTables.fixedColumns.min.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/extensions/dataTables.colResize.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/DT_bootstrap/DT_bootstrap.js"></script> <script language="javascript" type="text/javascript" src="/static/packages/TableTools/media/js/TableTools.min.js"></script> @@ -131,7 +129,7 @@ { "type": "natural" }, { "type": "natural" }, { "type": "natural" }, - { "type": "natural" }, + { "type": "natural", "width": "20%"}, { "type": "natural" }, { "type": "natural" }, { "type": "natural" }, @@ -139,13 +137,10 @@ { "type": "natural" } ], "order": [[ 1, "asc" ]], - "sDom": "RJtir", - "iDisplayLength": -1, - "autoWidth": true, + "sDom": "RZtir", + "autoWidth": false, "bLengthChange": true, "bDeferRender": true, - "bSortClasses": false, - "scrollY": "700px", "scrollCollapse": false, "colResize": { "tableWidthFixed": false, |