Interval map graph now works properly

Tried to export trait data for "color by trait" function

10 files changed, 46 insertions, 28 deletions

diff --git a/wqflask/wqflask/my_pylmm/pyLMM/lmm.py b/wqflask/wqflask/my_pylmm/pyLMM/lmm.py
index 6ef1669b..60d36b8d 100644
--- a/wqflask/wqflask/my_pylmm/pyLMM/lmm.py
+++ b/wqflask/wqflask/my_pylmm/pyLMM/lmm.py
@@ -107,8 +107,6 @@ def run_human(pheno_vector,
 
         with Bench("Create list of inputs"):
             inputs = list(plink_input)
-            
-        print("len(genotypes): ", len(inputs))
 
         with Bench("Divide into chunks"):
             results = chunks.divide_into_chunks(inputs, 64)
diff --git a/wqflask/wqflask/static/new/css/interval_mapping.css b/wqflask/wqflask/static/new/css/interval_mapping.css
index 9d23ba25..5ebf7742 100644
--- a/wqflask/wqflask/static/new/css/interval_mapping.css
+++ b/wqflask/wqflask/static/new/css/interval_mapping.css
@@ -1,27 +1,32 @@
-.manhattan_plot .y_axis path,

-.manhattan_plot .y_axis line {

+.interval_map .y_axis path,

+.interval_map .y_axis line {

     fill: none;

     stroke: black;

     shape-rendering: crispEdges;

 }

-.manhattan_plot .y_axis text {

+.interval_map .y_axis text {

     font-family: sans-serif;

     font-size: 14px;

 }

 

-.manhattan_plot .x_axis path,

-.manhattan_plot .x_axis line {

+.interval_map .x_axis path,

+.interval_map .x_axis line {

     fill: none;

     stroke: black;

     shape-rendering: crispEdges;

 }

-.manhattan_plot .x_axis text {

+.interval_map .x_axis text {

     text-anchor: end;

     font-family: sans-serif;

     font-size: 8px;

 }

 

-rect {

+interval_map rect {

     stroke: WhiteSmoke;

-    fill: lightgrey;

+    fill: white;

+}

+

+interval_map path {

+    stroke: steelblue;

+    stroke-width: 1;

 }
\ No newline at end of file
diff --git a/wqflask/wqflask/static/new/css/marker_regression.css b/wqflask/wqflask/static/new/css/marker_regression.css
index 054ef93e..a737c97e 100644
--- a/wqflask/wqflask/static/new/css/marker_regression.css
+++ b/wqflask/wqflask/static/new/css/marker_regression.css
@@ -21,10 +21,10 @@
     font-size: 8px;
 }
 
-rect {
+/*rect {
     stroke: WhiteSmoke;
     fill: lightgrey;
-}
+}*/
 /*rect {
     stroke: WhiteSmoke;
     fill: Azure;
diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.coffee b/wqflask/wqflask/static/new/javascript/bar_chart.coffee
index 412185d8..d18cadd2 100644
--- a/wqflask/wqflask/static/new/javascript/bar_chart.coffee
+++ b/wqflask/wqflask/static/new/javascript/bar_chart.coffee
@@ -124,6 +124,7 @@ class Bar_Chart
         
         d3.select("#color_by_trait").on("click", =>
             @color_by_trait()
+            
         )
 
     get_attr_color_dict: () ->
diff --git a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee
index f1d41cbe..23499ac5 100644
--- a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee
+++ b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.coffee
@@ -1,9 +1,11 @@
+root = exports ? this
 
 console.log("before get_traits_from_collection")
 
 # Going to be used to hold collection list
 # So we can repopulate it when the back button is clicked
 collection_list = null
+this_trait_data = null
 
 collection_click = () ->
     console.log("Clicking on:", $(this))
@@ -16,7 +18,7 @@ collection_click = () ->
         url: this_collection_url,
         success: process_traits
       )
-    
+
 trait_click = () ->
     console.log("Clicking on:", $(this))
     trait = $(this).find('.trait').text()
@@ -30,7 +32,9 @@ trait_click = () ->
       )
 
 color_by_trait =  (trait_sample_data, textStatus, jqXHR) ->
-    console.log('in color_by_trait:', trait_sample_data)
+    root.trait_sample_data = trait_sample_data
+    #console.log('in color_by_trait:', trait_sample_data)
+    
 
 process_traits = (trait_data, textStatus, jqXHR) ->
     console.log('in process_traits with trait_data:', trait_data)
@@ -65,3 +69,4 @@ $ ->
     $(document).on("click", ".collection_line", collection_click)
     $(document).on("click", ".trait_line", trait_click)
     $(document).on("click", "#back_to_collections", back_to_collections)
+    
diff --git a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js
index 104c411d..b4c2c200 100644
--- a/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js
+++ b/wqflask/wqflask/static/new/javascript/get_traits_from_collection.js
@@ -1,11 +1,15 @@
 // Generated by CoffeeScript 1.6.1
 (function() {
-  var back_to_collections, collection_click, collection_list, color_by_trait, process_traits, trait_click;
+  var back_to_collections, collection_click, collection_list, color_by_trait, process_traits, root, this_trait_data, trait_click;
+
+  root = typeof exports !== "undefined" && exports !== null ? exports : this;
 
   console.log("before get_traits_from_collection");
 
   collection_list = null;
 
+  this_trait_data = null;
+
   collection_click = function() {
     var this_collection_url;
     console.log("Clicking on:", $(this));
@@ -35,7 +39,7 @@
   };
 
   color_by_trait = function(trait_sample_data, textStatus, jqXHR) {
-    return console.log('in color_by_trait:', trait_sample_data);
+    return root.trait_sample_data = trait_sample_data;
   };
 
   process_traits = function(trait_data, textStatus, jqXHR) {
diff --git a/wqflask/wqflask/static/new/javascript/interval_mapping.coffee b/wqflask/wqflask/static/new/javascript/interval_mapping.coffee
index 78265f27..0aa21d97 100644
--- a/wqflask/wqflask/static/new/javascript/interval_mapping.coffee
+++ b/wqflask/wqflask/static/new/javascript/interval_mapping.coffee
@@ -215,10 +215,10 @@ $ ->
                 )

                 .enter()

                 .append("line")

-                .attr("x1", @x_scale)

-                .attr("x2", @x_scale)

                 .attr("y1", @y_buffer)

                 .attr("y2", @plot_height)

+                .attr("x1", @x_scale)

+                .attr("x2", @x_scale)

                 .style("stroke", "#ccc")

                 

         fill_chr_areas: () ->

@@ -239,7 +239,8 @@ $ ->
                 .attr("width", (d) =>

                     return @x_scale(d[0])

                 )

-                .attr("height", @plot_height-@y_buffer)                

+                .attr("height", @plot_height-@y_buffer)

+                .attr("fill", "white")

 

         add_chr_labels: () ->

             chr_names = []

@@ -263,12 +264,13 @@ $ ->
                 .attr("text-anchor", "middle")

                 .attr("font-family", "sans-serif")

                 .attr("font-size", "18px")

-                .attr("fill", "grey")

+                #.attr("fill", "grey")

 

         connect_markers: () ->

-            @svg.selectAll("path")

+            @svg.selectAll("line")

                 .data(@plot_coordinates)

                 .enter()

+                .append("line")

                 .attr("x1", (d, i) =>

                     if i == 0

                         return @x_buffer

@@ -287,6 +289,7 @@ $ ->
                 .attr("y2", (d) =>

                     return @plot_height - ((@plot_height-@y_buffer) * d[1]/@y_max)

                 )

+                .style("stroke", "black")

 

     console.time('Create manhattan plot')

     new Interval_Map(600, 1200)

diff --git a/wqflask/wqflask/static/new/javascript/interval_mapping.js b/wqflask/wqflask/static/new/javascript/interval_mapping.js
index 5ae8ffab..521a1c7a 100644
--- a/wqflask/wqflask/static/new/javascript/interval_mapping.js
+++ b/wqflask/wqflask/static/new/javascript/interval_mapping.js
@@ -205,7 +205,7 @@
         var _this = this;
         return this.svg.selectAll("line").data(this.cumulative_chr_lengths, function(d) {
           return d;
-        }).enter().append("line").attr("x1", this.x_scale).attr("x2", this.x_scale).attr("y1", this.y_buffer).attr("y2", this.plot_height).style("stroke", "#ccc");
+        }).enter().append("line").attr("y1", this.y_buffer).attr("y2", this.plot_height).attr("x1", this.x_scale).attr("x2", this.x_scale).style("stroke", "#ccc");
       };
 
       Interval_Map.prototype.fill_chr_areas = function() {
@@ -220,7 +220,7 @@
           }
         }).attr("y", this.y_buffer).attr("width", function(d) {
           return _this.x_scale(d[0]);
-        }).attr("height", this.plot_height - this.y_buffer);
+        }).attr("height", this.plot_height - this.y_buffer).attr("fill", "white");
       };
 
       Interval_Map.prototype.add_chr_labels = function() {
@@ -237,12 +237,12 @@
           return d[0];
         }).attr("x", function(d) {
           return _this.x_scale(d[2] - d[1] / 2);
-        }).attr("y", this.plot_height * 0.1).attr("dx", "0em").attr("text-anchor", "middle").attr("font-family", "sans-serif").attr("font-size", "18px").attr("fill", "grey");
+        }).attr("y", this.plot_height * 0.1).attr("dx", "0em").attr("text-anchor", "middle").attr("font-family", "sans-serif").attr("font-size", "18px");
       };
 
       Interval_Map.prototype.connect_markers = function() {
         var _this = this;
-        return this.svg.selectAll("path").data(this.plot_coordinates).enter().attr("x1", function(d, i) {
+        return this.svg.selectAll("line").data(this.plot_coordinates).enter().append("line").attr("x1", function(d, i) {
           if (i === 0) {
             return _this.x_buffer;
           } else {
@@ -258,7 +258,7 @@
           return parseFloat(_this.x_buffer) + ((parseFloat(_this.plot_width) - parseFloat(_this.x_buffer)) * d[0] / parseFloat(_this.x_max));
         }).attr("y2", function(d) {
           return _this.plot_height - ((_this.plot_height - _this.y_buffer) * d[1] / _this.y_max);
-        });
+        }).style("stroke", "black");
       };
 
       return Interval_Map;
diff --git a/wqflask/wqflask/templates/collections/list.html b/wqflask/wqflask/templates/collections/list.html
index ac621a61..354723d0 100644
--- a/wqflask/wqflask/templates/collections/list.html
+++ b/wqflask/wqflask/templates/collections/list.html
@@ -35,7 +35,7 @@
         </table>
 
         {# if "color_by_trait" in params #}
-        <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script>
+<!--        <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script>-->
         {# endif #}
         
         </div>
diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html
index ec729e1c..0ad6eedb 100644
--- a/wqflask/wqflask/templates/show_trait.html
+++ b/wqflask/wqflask/templates/show_trait.html
@@ -2,6 +2,7 @@
 {% block title %}Trait Data and Analysis{% endblock %}
 {% block css %}
     <link rel="stylesheet" type="text/css" href="/static/new/css/marker_regression.css" />
+    <link rel="stylesheet" type="text/css" href="/static/new/css/interval_mapping.css" />
     <link rel="stylesheet" type="text/css" href="/static/new/css/bar_chart.css" />
     <link rel="stylesheet" type="text/css" href="/static/new/css/box_plot.css" />
     <link rel="stylesheet" type="text/css" href="/static/new/packages/DataTables/css/jquery.dataTables.css" />
@@ -55,9 +56,10 @@
 
     <script type="text/javascript" src="/static/new/javascript/stats.js"></script>
     <script type="text/javascript" src="/static/new/javascript/box.js"></script>
+    <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script>    
     <script type="text/javascript" src="/static/new/javascript/bar_chart.js"></script>
     <script type="text/javascript" src="/static/new/javascript/box_plot.js"></script>
-    <script type="text/javascript" src="/static/new/javascript/get_traits_from_collection.js"></script>
+
     <script type="text/javascript" src="/static/new/javascript/show_trait.js"></script>
     <script type="text/javascript" src="/static/new/javascript/show_trait_mapping_tools.js"></script>
     <script type="text/javascript" src="/static/new/javascript/validation.js"></script>