Merge pull request #251 from lyan6/master

Add meta info (X axis, Y axis) for Correlation Scatterplot

3 files changed, 61 insertions, 9 deletions

diff --git a/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.js b/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.js
index a6675ccc..28534709 100644
--- a/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.js
+++ b/wqflask/wqflask/static/new/javascript/draw_corr_scatterplot.js
@@ -1,16 +1,16 @@
 // Generated by CoffeeScript 1.8.0
 var data, h, halfh, halfw, indID, intercept, margin, mychart, slope, totalh, totalw, w;
 
-h = 400;
+h = 600;
 
-w = 500;
+w = 800;
 
 margin = {
-  left: 60,
-  top: 40,
+  left: 80,
+  top: 60,
   right: 40,
   bottom: 40,
-  inner: 5
+  inner: 30
 };
 
 halfh = h + margin.top + margin.bottom;
diff --git a/wqflask/wqflask/static/new/javascript/scatterplot.js b/wqflask/wqflask/static/new/javascript/scatterplot.js
index 08594555..de7b7906 100644
--- a/wqflask/wqflask/static/new/javascript/scatterplot.js
+++ b/wqflask/wqflask/static/new/javascript/scatterplot.js
@@ -166,7 +166,7 @@ scatterplot = function() {
       maxx = xlim[1];
       yticks = yticks != null ? yticks : ys.ticks(nyticks);
       xticks = xticks != null ? xticks : xs.ticks(nxticks);
-      titlegrp = g.append("g").attr("class", "title").append("text").attr("x", margin.left + width / 2).attr("y", margin.top - titlepos).text(title);
+      titlegrp = g.append("g").attr("class", "title").append("text").attr("x", margin.left + width / 2).attr("y", margin.top - titlepos).style("fill", "black").style("font-size", "28px").text(title);
       xaxis = g.append("g").attr("class", "x axis");
       xaxis.selectAll("empty").data(xticks).enter().append("line").attr("x1", function(d) {
         return xscale(d);
@@ -178,7 +178,7 @@ scatterplot = function() {
       }).attr("y", margin.top + height + axispos.xlabel).text(function(d) {
         return formatAxis(xticks)(d);
       });
-      xaxis.append("text").attr("class", "title").attr("x", margin.left + width / 2).attr("y", margin.top + height + axispos.xtitle).text(xlab);
+      xaxis.append("text").attr("class", "title").attr("x", margin.left + width / 2).attr("y", margin.top + height + axispos.xtitle).style("fill", "black").text(xlab);
       if (xNA.handle) {
         xaxis.append("text").attr("x", margin.left + xNA.width / 2).attr("y", margin.top + height + axispos.xlabel).text("N/A");
       }
@@ -194,7 +194,7 @@ scatterplot = function() {
       }).attr("x", margin.left - axispos.ylabel).text(function(d) {
         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) + ")" : "");
+      yaxis.append("text").attr("class", "title").attr("y", margin.top + height / 2).attr("x", margin.left - axispos.ytitle).style("fill", "black").text(ylab).attr("transform", rotate_ylab ? "rotate(270," + (margin.left - axispos.ytitle) + "," + (margin.top + height / 2) + ")" : "");
       if (yNA.handle) {
         yaxis.append("text").attr("x", margin.left - axispos.ylabel).attr("y", margin.top + height - yNA.width / 2).text("N/A");
       }
diff --git a/wqflask/wqflask/templates/corr_scatterplot.html b/wqflask/wqflask/templates/corr_scatterplot.html
index 2b2119ea..810f4ca3 100644
--- a/wqflask/wqflask/templates/corr_scatterplot.html
+++ b/wqflask/wqflask/templates/corr_scatterplot.html
@@ -47,10 +47,62 @@
     </tr>

 </table>

 </form>-->

-

+<div class="container">

 <div id="chart1" class="qtlcharts"></div>

 

+<div style="margin-left: 80px;">

+

+    {% if trait_1.dataset.type == "ProbeSet" %}

+		<div>

+			X axis:

+			<a href="{{url_for('show_trait_page', trait_id = trait_1.name, dataset = trait_1.dataset.name)}}">

+				{{trait_1.dataset.group.species + " " + trait_1.dataset.group.name + " " + trait_1.dataset.tissue + " "  + trait_1.dataset.name + ": " + trait_1.name|string}}

+			</a>

+		</div>

+		<div>

+			[{{trait_1.symbol}} on {{trait_1.location_repr}} Mb]

+			{{trait_1.description_display}}

+		</div>

+    {% elif trait_1.dataset.type == "Publish" %}

+		<div>

+			X axis:

+            <a href="{{url_for('show_trait_page', trait_id = trait_1.name, dataset = trait_1.dataset.name)}}">

+                {{trait_1.dataset.group.species + " " + trait_1.dataset.group.name + " " + trait_1.dataset.name + ": " + trait_1.name|string}}

+            </a>

+		</div>

+		<div>

+			<a href="{{trait_1.pubmed_link}}">PubMed: {{trait_1.pubmed_text}}</a>

+			{{trait_1.description_display}}	

+		</div>

+    {% endif %}

+

+	<br/>

 

+    {% if trait_2.dataset.type == "ProbeSet" %}

+		<div>

+			Y axis:

+            <a href="{{url_for('show_trait_page', trait_id = trait_2.name, dataset = trait_2.dataset.name)}}">

+                {{trait_2.dataset.group.species + " " + trait_2.dataset.group.name + " " + trait_2.dataset.tissue + " "  + trait_2.dataset.name + ": " + trait_2.name|string}}

+            </a>

+        </div>

+        <div>

+			[{{trait_2.symbol}} on {{trait_2.location_repr}} Mb]

+			{{trait_2.description_display}}

+		</div>

+    {% elif trait_2.dataset.type == "Publish" %}

+        <div>

+			Y axis:

+            <a href="{{url_for('show_trait_page', trait_id = trait_2.name, dataset = trait_2.dataset.name)}}">

+                {{trait_2.dataset.group.species + " " + trait_2.dataset.group.name + " " + trait_2.dataset.name + ": " + trait_2.name|string}}

+            </a>

+        </div>

+        <div>

+			<a href="{{trait_2.pubmed_link}}">PubMed: {{trait_2.pubmed_text}}</a>

+			{{trait_2.description_display}}

+		</div>

+    {% endif %}

+	

+</div>

 {% endblock %}

 

 {% block js %}