diff options
| -rw-r--r-- | etc/default_settings.py | 3 | ||||
| -rw-r--r-- | wqflask/wqflask/static/new/javascript/biodalliance.js | 75 | ||||
| -rw-r--r-- | wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee | 1 | ||||
| -rw-r--r-- | wqflask/wqflask/static/new/javascript/chr_lod_chart.js | 31 | ||||
| -rw-r--r-- | wqflask/wqflask/static/new/javascript/lod_chart.coffee | 2 | ||||
| -rw-r--r-- | wqflask/wqflask/static/new/javascript/lod_chart.js | 60 | ||||
| -rw-r--r-- | wqflask/wqflask/templates/marker_regression_gn1.html | 45 | ||||
| -rw-r--r-- | wqflask/wqflask/views.py | 6 |
8 files changed, 158 insertions, 65 deletions
diff --git a/etc/default_settings.py b/etc/default_settings.py index df734f7c..f3ca2e58 100644 --- a/etc/default_settings.py +++ b/etc/default_settings.py @@ -56,3 +56,6 @@ GENENETWORK_FILES = HOME+"/gn2_data" PYLMM_COMMAND = str.strip(os.popen("which pylmm_redis").read()) PLINK_COMMAND = str.strip(os.popen("which plink2").read()) GEMMA_COMMAND = str.strip(os.popen("which gemma").read()) + + +BIODALLIANCE_PATH = os.environ['HOME']+"/dalliance" diff --git a/wqflask/wqflask/static/new/javascript/biodalliance.js b/wqflask/wqflask/static/new/javascript/biodalliance.js new file mode 100644 index 00000000..2dde6365 --- /dev/null +++ b/wqflask/wqflask/static/new/javascript/biodalliance.js @@ -0,0 +1,75 @@ +"use strict"; + +var bd_browser = null; +var bd_data = {}; + +var getChrLen = function(chr) { + return js_data[chr * 1]; +}; + +var createBDBrowser = function(chr, start, end, speciesName, sources) { + console.log("creating BD browser"); + var b = new Browser({ + chr: chr, + viewStart: start, + viewEnd: end, + + coordSystem: { + speciesName: speciesName + }, + + sources: sources, + + setDocumentTitle: false, + prefix: '/dalliance/', + noPersist: true, + pageName: 'bd_container' + }); + + console.log("created BD browser"); + return b; +}; + +var showBDButton = function() { + $('#open_bd').show(); + $('#close_bd').hide(); +}; + +var hideBDButton = function() { + $('#close_bd').show(); + $('#open_bd').hide(); +}; + + +var setBDData = function(chr, length) { + // bd_data = { chr: chr, length: length }; + bd_data.chr = chr; + bd_data.length = length; +}; + +var setBDSpecies = function(species) { + bd_data.species = species; +}; + + +var openBDBrowser = function() { + console.log("opening browser"); + if (!bd_browser) { + bd_browser = createBDBrowser(bd_data.chr, 0, bd_data.length * 1000000, bd_data.species, + [{name: 'Genome', + twoBitURI: 'http://www.biodalliance.org/datasets/GRCm38/mm10.2bit', + desc: 'Mouse reference genome build GRCm38', + tier_type: 'sequence', + provides_entrypoints: true}, + {name: 'QTL', + tier_type: 'qtl', + uri: 'http://gsocbox:8880/static/qtl/lod2.csv', + stylesheet_uri: "http://gsocbox:8880/stylesheets/qtl-stylesheet.xml" + }] + ); + } else { + bd_browser.setLocation(bd_data.chr, 0, bd_data.length * 1000000); + } + + bd_browser.maxViewWidth = bd_data.length * 1000000; +}; diff --git a/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee b/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee index e00694be..d3c1ee7d 100644 --- a/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee +++ b/wqflask/wqflask/static/new/javascript/chr_lod_chart.coffee @@ -273,6 +273,7 @@ class Chr_Lod_Chart $("#return_to_full_view").hide() $('#topchart').remove() $('#chart_container').append('<div class="qtlcharts" id="topchart"></div>') + hideBDButton() create_lod_chart() show_marker_in_table: (marker_info) -> diff --git a/wqflask/wqflask/static/new/javascript/chr_lod_chart.js b/wqflask/wqflask/static/new/javascript/chr_lod_chart.js index c6cbd01b..0032858f 100644 --- a/wqflask/wqflask/static/new/javascript/chr_lod_chart.js +++ b/wqflask/wqflask/static/new/javascript/chr_lod_chart.js @@ -1,13 +1,12 @@ -// Generated by CoffeeScript 1.9.2 +// Generated by CoffeeScript 1.10.0 var Chr_Lod_Chart; Chr_Lod_Chart = (function() { - function Chr_Lod_Chart(plot_height, plot_width, chr, manhattanPlot, mappingScale) { + function Chr_Lod_Chart(plot_height, plot_width, chr, manhattanPlot) { this.plot_height = plot_height; this.plot_width = plot_width; this.chr = chr; this.manhattanPlot = manhattanPlot; - this.mappingScale = mappingScale; this.qtl_results = js_data.qtl_results; console.log("qtl_results are:", this.qtl_results); console.log("chr is:", this.chr); @@ -66,6 +65,8 @@ Chr_Lod_Chart = (function() { } else { this_chr = result.chr; } + console.log("this_chr is:", this_chr); + console.log("@chr[0] is:", parseInt(this.chr[0])); if (this_chr > parseInt(this.chr[0])) { break; } @@ -95,18 +96,11 @@ Chr_Lod_Chart = (function() { Chr_Lod_Chart.prototype.create_coordinates = function() { var i, len, ref, result, results; ref = this.these_results; - console.log("THESE_RESULTS:", ref) results = []; for (i = 0, len = ref.length; i < len; i++) { result = ref[i]; this.x_coords.push(parseFloat(result.Mb)); - if (js_data.result_score_type == "LOD") { - this.y_coords.push(result.lod_score); - } - else { - console.log("LRS VALUE:", result['lrs_value']) - this.y_coords.push(result['lrs_value']); - } + this.y_coords.push(result.lod_score); results.push(this.marker_names.push(result.name)); } return results; @@ -119,19 +113,7 @@ Chr_Lod_Chart = (function() { }; Chr_Lod_Chart.prototype.create_scales = function() { - if (this.mappingScale == "morgan") { - max_pos = 0 - for (i = 0, len = this.these_results.length; i < len; i++) { - marker = this.these_results[i] - if (parseFloat(marker['Mb']) > max_pos){ - max_pos = parseFloat(marker.Mb) - } - } - this.x_scale = d3.scale.linear().domain([0, max_pos]).range([this.x_buffer, this.plot_width]); - } - else { - this.x_scale = d3.scale.linear().domain([0, this.chr[1]]).range([this.x_buffer, this.plot_width]); - } + this.x_scale = d3.scale.linear().domain([0, this.chr[1]]).range([this.x_buffer, this.plot_width]); return this.y_scale = d3.scale.linear().domain([0, this.y_max]).range([this.plot_height, this.y_buffer]); }; @@ -278,6 +260,7 @@ Chr_Lod_Chart = (function() { $("#return_to_full_view").hide(); $('#topchart').remove(); $('#chart_container').append('<div class="qtlcharts" id="topchart"></div>'); + hideBDButton(); return create_lod_chart(); }; diff --git a/wqflask/wqflask/static/new/javascript/lod_chart.coffee b/wqflask/wqflask/static/new/javascript/lod_chart.coffee index 55ffdce0..2da2e5bb 100644 --- a/wqflask/wqflask/static/new/javascript/lod_chart.coffee +++ b/wqflask/wqflask/static/new/javascript/lod_chart.coffee @@ -123,6 +123,8 @@ lodchart = () -> .on("click", (d) -> console.log("d is:", d) redraw_plot(d) + setBDData(d[0], d[1]) + showBDButton() ) # x-axis labels diff --git a/wqflask/wqflask/static/new/javascript/lod_chart.js b/wqflask/wqflask/static/new/javascript/lod_chart.js index 014bf59b..c6d1045c 100644 --- a/wqflask/wqflask/static/new/javascript/lod_chart.js +++ b/wqflask/wqflask/static/new/javascript/lod_chart.js @@ -1,8 +1,8 @@ -// Generated by CoffeeScript 1.9.2 +// Generated by CoffeeScript 1.10.0 var lodchart; lodchart = function() { - var additive, additive_ylab, additive_ylim, additive_yscale, additive_yticks, additivelinecolor, axispos, chart, chrGap, chrSelect, darkrect, height, lightrect, linewidth, lodcurve, lodlinecolor, lodvarname, manhattanPlot, mappingScale, margin, markerSelect, nyticks, pad4heatmap, pointcolor, pointsAtMarkers, pointsize, pointstroke, rotate_ylab, significantcolor, suggestivecolor, title, titlepos, width, xlab, xscale, ylab, ylim, yscale, yticks; + var additive, additive_ylab, additive_ylim, additive_yscale, additive_yticks, additivelinecolor, axispos, chart, chrGap, chrSelect, darkrect, height, lightrect, linewidth, lodcurve, lodlinecolor, lodvarname, manhattanPlot, margin, markerSelect, nyticks, pad4heatmap, pointcolor, pointsAtMarkers, pointsize, pointstroke, rotate_ylab, significantcolor, suggestivecolor, title, titlepos, width, xlab, xscale, ylab, ylim, yscale, yticks; width = 800; height = 500; margin = { @@ -20,6 +20,7 @@ lodchart = function() { }; titlepos = 20; manhattanPlot = false; + additive = false; ylim = null; additive_ylim = null; nyticks = 5; @@ -29,8 +30,7 @@ lodchart = function() { darkrect = "#F1F1F9"; lightrect = "#FBFBFF"; lodlinecolor = "darkslateblue"; - additivelinecolor_plus = "red"; - additivelinecolor_negative = "green"; + additivelinecolor = "red"; linewidth = 2; suggestivecolor = "gainsboro"; significantcolor = "#EBC7C7"; @@ -70,15 +70,14 @@ lodchart = function() { return results; })(); ylim = ylim != null ? ylim : [0, d3.max(data[lodvarname])]; - - if ('additive' in data) { + if (additive) { data['additive'] = (function() { var j, len, ref, results; ref = data['additive']; results = []; for (j = 0, len = ref.length; j < len; j++) { x = ref[j]; - results.push(x); + results.push(Math.abs(x)); } return results; })(); @@ -92,12 +91,12 @@ lodchart = function() { g.append("rect").attr("x", margin.left).attr("y", margin.top).attr("height", height).attr("width", width).attr("fill", darkrect).attr("stroke", "none"); yscale.domain(ylim).range([height + margin.top, margin.top + margin.inner]); yticks = yticks != null ? yticks : yscale.ticks(nyticks); - if ('additive' in data) { + if (additive) { additive_yscale.domain(additive_ylim).range([height + margin.top, margin.top + margin.inner + height / 2]); additive_yticks = additive_yticks != null ? additive_yticks : additive_yscale.ticks(nyticks); } reorgLodData(data, lodvarname); - data = chrscales(data, width, chrGap, margin.left, pad4heatmap, mappingScale); + data = chrscales(data, width, chrGap, margin.left, pad4heatmap); xscale = data.xscale; chrSelect = g.append("g").attr("class", "chrRect").selectAll("empty").data(data.chrnames).enter().append("rect").attr("id", function(d) { return "chrrect" + d[0]; @@ -118,7 +117,9 @@ lodchart = function() { return lightrect; }).attr("stroke", "none").on("click", function(d) { console.log("d is:", d); - return redraw_plot(d); + redraw_plot(d); + setBDData(d[0], d[1]); + return showBDButton(); }); xaxis = g.append("g").attr("class", "x axis"); xaxis.selectAll("empty").data(data.chrnames).enter().append("text").text(function(d) { @@ -133,7 +134,7 @@ lodchart = function() { var chr_plot; $('#topchart').remove(); $('#chart_container').append('<div class="qtlcharts" id="topchart"></div>'); - return chr_plot = new Chr_Lod_Chart(600, 1200, chr_ob, manhattanPlot, mappingScale); + return chr_plot = new Chr_Lod_Chart(600, 1200, chr_ob, manhattanPlot); }; rotate_ylab = rotate_ylab != null ? rotate_ylab : ylab.length > 1; yaxis = g.append("g").attr("class", "y axis"); @@ -148,7 +149,7 @@ lodchart = function() { return formatAxis(yticks)(d); }); yaxis.append("text").attr("class", "title").attr("y", margin.top + height / 2).attr("x", margin.left - axispos.ytitle).text(ylab).attr("transform", rotate_ylab ? "rotate(270," + (margin.left - axispos.ytitle) + "," + (margin.top + height / 2) + ")" : "").attr("text-anchor", "middle").attr("fill", "slateblue"); - if ('additive' in data) { + if (additive) { rotate_additive_ylab = rotate_additive_ylab != null ? rotate_additive_ylab : additive_ylab.length > 1; additive_yaxis = g.append("g").attr("class", "y axis"); additive_yaxis.selectAll("empty").data(additive_yticks).enter().append("line").attr("y1", function(d) { @@ -187,19 +188,13 @@ lodchart = function() { return yscale(data.lodByChr[chr][i][lodcolumn]); }); }; - if ('additive' in data) { + if (additive) { additivecurve = function(chr, lodcolumn) { - if (data.additiveByChr[chr][0] < 0) { - pos_neg = "negative" - } - else { - pos_neg = "positive" - } - return [pos_neg, d3.svg.line().x(function(d) { + return d3.svg.line().x(function(d) { return xscale[chr](d); }).y(function(d, i) { - return additive_yscale(Math.abs(data.additiveByChr[chr][i])); - })]; + return additive_yscale(data.additiveByChr[chr][i][lodcolumn]); + }); }; } curves = g.append("g").attr("id", "curves"); @@ -210,17 +205,12 @@ lodchart = function() { curves.append("path").datum(data.posByChr[chr[0]]).attr("d", lodcurve(chr[0], lodvarnum)).attr("stroke", lodlinecolor).attr("fill", "none").attr("stroke-width", linewidth).style("pointer-events", "none"); } } - if ('additive' in data) { + if (additive) { ref1 = data.chrnames; for (k = 0, len1 = ref1.length; k < len1; k++) { chr = ref1[k]; if (chr.indexOf(data['chr'])) { - if (additivecurve(chr[0], lodvarnum)[0] == "negative") { - curves.append("path").datum(data.posByChr[chr[0]]).attr("d", additivecurve(chr[0], lodvarnum)[1]).attr("stroke", additivelinecolor_negative).attr("fill", "none").attr("stroke-width", 1).style("pointer-events", "none"); - } - else { - curves.append("path").datum(data.posByChr[chr[0]]).attr("d", additivecurve(chr[0], lodvarnum)[1]).attr("stroke", additivelinecolor_plus).attr("fill", "none").attr("stroke-width", 1).style("pointer-events", "none"); - } + curves.append("path").datum(data.posByChr[chr[0]]).attr("d", additivecurve(chr[0], lodvarnum)).attr("stroke", additivelinecolor).attr("fill", "none").attr("stroke-width", 1).style("pointer-events", "none"); } } } @@ -305,13 +295,6 @@ lodchart = function() { manhattanPlot = value; return chart; }; - chart.mappingScale = function(value) { - if (!arguments.length) { - return mappingScale; - } - mappingScale = value; - return chart; - }; chart.ylim = function(value) { if (!arguments.length) { return ylim; @@ -449,6 +432,9 @@ lodchart = function() { chart.yscale = function() { return yscale; }; + chart.additive = function() { + return additive; + }; chart.additive_yscale = function() { return additive_yscale; }; @@ -470,4 +456,4 @@ lodchart = function() { return chrSelect; }; return chart; -}; \ No newline at end of file +}; diff --git a/wqflask/wqflask/templates/marker_regression_gn1.html b/wqflask/wqflask/templates/marker_regression_gn1.html index 978ea55f..efb80494 100644 --- a/wqflask/wqflask/templates/marker_regression_gn1.html +++ b/wqflask/wqflask/templates/marker_regression_gn1.html @@ -160,8 +160,23 @@ </div> {% if mapping_method != "gemma" %} <div class="tab-pane {% if mapping_method == "gemma" %}active{% endif %}" id="vector_map"> - <div id="chart_container"> - <div class="qtlcharts" id="topchart"></div> + <div id="chart_container"> + <div id="return_to_full_view" style="display:none"> + Return to full view + </div> + + <div id="open_bd" style="display:none"> + Open BioDalliance view + </div> + + <div id="close_bd" style="display:none"> + Return to vector map + </div> + + <div class="qtlcharts" id="topchart"></div> + + <div id="bd_container" class="qtlcharts"> + </div> </div> </div> {% endif %} @@ -269,10 +284,15 @@ <script language="javascript" type="text/javascript" src="/static/new/javascript/chr_lod_chart.js"></script> <script language="javascript" type="text/javascript" src="/static/new/javascript/lod_chart.js"></script> <script language="javascript" type="text/javascript" src="/static/new/javascript/create_lodchart.js"></script> + + <script language="javascript" type="text/javascript" src="/dalliance/dalliance-all.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/biodalliance.js"></script> {% endif %} <script type="text/javascript" charset="utf-8"> $(document).ready( function () { + setBDSpecies("{{ dataset.group.species }}"); + console.time("Creating table"); $('#qtl_results').dataTable( { "columns": [ @@ -316,9 +336,27 @@ }); $('#gn1_map_tab').click(function(){ - $('div#gn1_map_options').show(); + $('#gn1_map_options').show(); + $('div#bd_container').hide(); }); + $('#close_bd').click(function() { + $('#open_bd').show(); + $('#close_bd').hide(); + + $('#bd_container').hide(); + $('#topchart').show(); + }); + + $('#open_bd').click(function() { + $('#close_bd').show(); + $('#open_bd').hide() + + $('#topchart').hide(); + $('#bd_container').show(); + + openBDBrowser(); + }) }); chrView = function(this_chr, chr_mb_list) { @@ -355,4 +393,3 @@ </script> {% endblock %} - diff --git a/wqflask/wqflask/views.py b/wqflask/wqflask/views.py index 70e465d1..55efd7e4 100644 --- a/wqflask/wqflask/views.py +++ b/wqflask/wqflask/views.py @@ -106,6 +106,12 @@ def tmp_page(img_path): img_base64 = bytesarray ) +@app.route("/dalliance/<path:filename>") +def bd_files(filename): + bd_path = app.config['BIODALLIANCE_PATH'] + return send_from_directory(bd_path, filename) + + #@app.route("/data_sharing") #def data_sharing_page(): # logger.info("In data_sharing") |