Merge pull request #491 from zsloan/feature/manhattan_plot_coloring

Feature/manhattan plot coloring

5 files changed, 74 insertions, 12 deletions

diff --git a/wqflask/wqflask/marker_regression/display_mapping_results.py b/wqflask/wqflask/marker_regression/display_mapping_results.py
index 3f6de2b2..08c2d750 100644
--- a/wqflask/wqflask/marker_regression/display_mapping_results.py
+++ b/wqflask/wqflask/marker_regression/display_mapping_results.py
@@ -74,6 +74,14 @@ DARKVIOLET = ImageColor.getrgb("darkviolet")
 MEDIUMPURPLE = ImageColor.getrgb("mediumpurple")
 # ---- END: Define common colours ---- #
 
+# ZS: List of distinct colors for manhattan plot if user selects "varied"
+COLOR_CODES = ["#FF0000", "#00FF00", "#0000FF", "#FFFF00", "#FF00FF", "#00FFFF",
+               "#000000", "#800000", "#008000", "#000080", "#808000", "#800080",
+               "#008080", "#808080", "#C00000", "#00C000", "#0000C0", "#C0C000",
+               "#C000C0", "#00C0C0", "#C0C0C0", "#400000", "#004000", "#000040"]
+
+DISTINCT_COLOR_LIST = [ImageColor.getrgb(color) for color in COLOR_CODES]
+
 # ---- FONT FILES ---- #
 VERDANA_FILE = "./wqflask/static/fonts/verdana.ttf"
 VERDANA_BOLD_FILE = "./wqflask/static/fonts/verdanab.ttf"
@@ -293,6 +301,12 @@ class DisplayMappingResults(object):
             self.plotScale = "physic"
 
         self.manhattan_plot = start_vars['manhattan_plot']
+        if self.manhattan_plot:
+            self.color_scheme = "alternating"
+            if 'color_scheme' in start_vars:
+                self.color_scheme = start_vars['color_scheme']
+                if self.color_scheme == "single":
+                    self.manhattan_single_color = ImageColor.getrgb("#" + start_vars['manhattan_single_color'])
 
         if 'permCheck' in list(start_vars.keys()):
             self.permChecked = start_vars['permCheck']
@@ -2424,10 +2438,16 @@ class DisplayMappingResults(object):
                             Yc = yZero - qtlresult['lod_score']*LRSHeightThresh/LRS_LOD_Max
 
                 if self.manhattan_plot == True:
-                    if self.selectedChr == -1 and (previous_chr_as_int % 2 == 1):
-                        point_color = RED
+                    if self.color_scheme == "single":
+                        point_color = self.manhattan_single_color
+                    elif self.color_scheme == "varied":
+                        point_color = DISTINCT_COLOR_LIST[previous_chr_as_int]
                     else:
-                        point_color = BLUE
+                        if self.selectedChr == -1 and (previous_chr_as_int % 2 == 1):
+                            point_color = RED
+                        else:
+                            point_color = BLUE
+
                     im_drawer.text(
                         text="5",
                         xy=(
diff --git a/wqflask/wqflask/marker_regression/run_mapping.py b/wqflask/wqflask/marker_regression/run_mapping.py
index 31d6a67c..c474e0e0 100644
--- a/wqflask/wqflask/marker_regression/run_mapping.py
+++ b/wqflask/wqflask/marker_regression/run_mapping.py
@@ -138,7 +138,12 @@ class RunMapping(object):
             mapping_results_filename = self.dataset.group.name + "_" + ''.join(random.choice(string.ascii_uppercase + string.digits) for _ in range(6))
             self.mapping_results_path = "{}{}.csv".format(webqtlConfig.GENERATED_IMAGE_DIR, mapping_results_filename)
 
-        if start_vars['manhattan_plot'] == "true":
+        if start_vars['manhattan_plot']:
+            self.color_scheme = "alternating"
+            if "color_scheme" in start_vars:
+                self.color_scheme = start_vars['color_scheme']
+                if self.color_scheme == "single":
+                    self.manhattan_single_color = start_vars['manhattan_single_color']
             self.manhattan_plot = True
         else:
             self.manhattan_plot = False
diff --git a/wqflask/wqflask/templates/mapping_results.html b/wqflask/wqflask/templates/mapping_results.html
index 28d93542..9542c29d 100644
--- a/wqflask/wqflask/templates/mapping_results.html
+++ b/wqflask/wqflask/templates/mapping_results.html
@@ -40,6 +40,9 @@
         <input type="hidden" name="use_loco" value="{{ use_loco }}">
         <input type="hidden" name="selected_chr" value="{{ selectedChr }}">
         <input type="hidden" name="manhattan_plot" value="{{ manhattan_plot }}">
+        {% if manhattan_plot == True %}
+        <input type="hidden" name="color_scheme" value="alternating">
+        {% endif %}
         <input type="hidden" name="num_perm" value="{{ nperm }}">
         <input type="hidden" name="perm_info" value="">
         <input type="hidden" name="perm_strata" value="{{ perm_strata }}">
@@ -55,7 +58,7 @@
         <input type="hidden" name="wanted_inputs" value="">
         <input type="hidden" name="form_url" value="/run_mapping">
         
-        <div class="container">
+        <div class="container" style="min-width: 1400px;">
           <div class="col-xs-5">
               <h2>Map Viewer: Whole Genome</h2><br>
               <b>Population:</b> {{ dataset.group.species|capitalize }} {{ dataset.group.name }}<br>
@@ -77,7 +80,7 @@
               <table>
                 <tr>
                   <td><b>Chr:&nbsp;</b></td>
-                  <td>
+                  <td style="padding: 5px;">
                     <select name="chromosomes" size="1">
                         {% for chr in ChrList %}
                         <option value="{{ chr[1] }}" {% if (chr[1] + 1) == selectedChr %}selected{% endif %}>{{ chr[0] }}</option>
@@ -87,7 +90,7 @@
                   </td>
                 </tr>
                 <tr>
-                  <td><b>View:&nbsp;</b></td>
+                  <td ><b>View:&nbsp;</b></td>
                   <td style="padding: 5px;">
                     <input type="text" name="startMb" size="7" value="{% if startMb != -1 %}{{ startMb }}{% endif %}"> to <input type="text" name="endMb" size="7" value="{% if endMb != -1 %}{{ endMb }}{% endif %}">
                   </td>
@@ -114,11 +117,31 @@
                 </tr>
                 <tr>
                   <td><b>Width:&nbsp;</b></td>
-                  <td>
+                  <td style="padding: 5px;">
                     <input type="text" name="graphWidth" value="{% if graphWidth is defined %}{{ graphWidth }}{% else %}1600{% endif %}" size="5"><span style="font-size: 12px;"> pixels (minimum=900)</span>
                   </td>
                 </tr>
               </table>
+              {% if manhattan_plot == True and selectedChr == -1 %}
+              <table style="margin-top: 10px;">
+                <tr>
+                  <td>
+                    <b>Manhattan Plot Color Scheme:&nbsp;</b>
+                  </td>
+                  <td>
+                    <select id="color_scheme">
+                      <option value="alternating" {% if color_scheme == "alternating" %}selected{% endif %}>Alternating</option>
+                      <option value="varied" {% if color_scheme == "varied" %}selected{% endif %}>Varied by Chr</option>
+                      <option value="single" {% if color_scheme == "single" %}selected{% endif %}>Single Color</option>
+                    </select>
+                  </td>
+                  <td>
+                    <input name="manhattan_single_color" type="hidden" id="point_color" value={% if manhattan_single_color %}{{ manhattan_single_color }}{% else %}"#D9D9D9"{% endif %}>
+                    <button style="display: none; margin-left: 5px;" id="point_color_picker" class="jscolor {valueElement: 'point_color'}">Choose Color</button>
+                  </td>
+                </tr>
+              </table>
+              {% endif %}
             </div>
             <div class="col-xs-4" style="padding: 0px;">
                   {% if (mapping_method == "reaper" or mapping_method == "rqtl_geno") and nperm > 0 %}
@@ -328,6 +351,9 @@
     <script type="text/javascript" src="{{ url_for('js', filename='underscore-string/underscore.string.min.js') }}"></script>
     <script type="text/javascript" src="{{ url_for('js', filename='d3-tip/d3-tip.js') }}"></script>
     <script type="text/javascript" src="/static/new/js_external/plotly-latest.min.js"></script>
+    {% if manhattan_plot == True and selectedChr == -1 %}
+    <script type="text/javascript" src="/static/new/js_external/jscolor.js"></script>
+    {% endif %}
 
     <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTables/js/jquery.dataTables.min.js') }}"></script>
     <script language="javascript" type="text/javascript" src="https://cdn.datatables.net/buttons/1.0.0/js/dataTables.buttons.min.js"></script>
@@ -423,7 +449,7 @@
 
         var mapping_input_list = ['temp_uuid', 'trait_id', 'dataset', 'tool_used', 'form_url', 'method', 'transform', 'trimmed_markers', 'selected_chr', 'chromosomes', 'mapping_scale',
                             'score_type', 'suggestive', 'significant', 'num_perm', 'permCheck', 'perm_output', 'perm_strata', 'categorical_vars', 'num_bootstrap', 'bootCheck', 'bootstrap_results',
-                            'LRSCheck', 'covariates', 'maf', 'use_loco', 'manhattan_plot', 'control_marker', 'control_marker_db', 'do_control', 'genofile', 
+                            'LRSCheck', 'covariates', 'maf', 'use_loco', 'manhattan_plot', 'color_scheme', 'manhattan_single_color', 'control_marker', 'control_marker_db', 'do_control', 'genofile',
                             'pair_scan', 'startMb', 'endMb', 'graphWidth', 'lrsMax', 'additiveCheck', 'showSNP', 'showGenes', 'viewLegend', 'haplotypeAnalystCheck', 
                             'mapmethod_rqtl_geno', 'mapmodel_rqtl_geno', 'temp_trait', 'group', 'species', 'reaper_version', 'primary_samples', 'n_samples']
 
@@ -449,10 +475,21 @@
 
         remap = function() { 
             $('input[name=selected_chr]').val($('select[name=chromosomes]').val());
+            $('input[name=color_scheme]').val($('select#color_scheme').val());
             $('#marker_regression_form').attr('action', '/loading');
             return $('#marker_regression_form').submit(); 
         };
 
+        {% if manhattan_plot == True and selectedChr == -1 %}
+        $('#color_scheme').change(function(){
+          if ($(this).val() == "single"){
+            $('#point_color_picker').show();
+          } else {
+            $('#point_color_picker').hide();
+          }
+        });
+        {% endif %}
+
         {% if mapping_method != "gemma" and mapping_method != "plink" %}
         $('#download_perm').click(function(){
           perm_info_dict = {
diff --git a/wqflask/wqflask/templates/search_result_page.html b/wqflask/wqflask/templates/search_result_page.html
index 8e2b06a4..9a28a78e 100644
--- a/wqflask/wqflask/templates/search_result_page.html
+++ b/wqflask/wqflask/templates/search_result_page.html
@@ -2,9 +2,9 @@
 {% block title %}Search Results{% endblock %}
 {% block css %}
     <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" />
+    <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='fontawesome/css/font-awesome.min.css') }}" />
     <link rel="stylesheet" type="text/css" href="{{ url_for('js', filename='DataTablesExtensions/scroller/css/scroller.dataTables.min.css') }}">
     <link rel="stylesheet" type="text/css" href="{{ url_for('js', filename='DataTablesExtensions/buttonStyles/css/buttons.dataTables.min.css') }}">
-    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
     <link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" />
     <link rel="stylesheet" type="text/css" href="static/new/css/trait_list.css" />
 {% endblock %}
@@ -440,8 +440,6 @@
                   'processing': 'Loading...'
                 }
             } );
-
-            console.timeEnd("Creating table");
             
             $('.toggle-vis').on( 'click', function (e) {
               e.preventDefault();
diff --git a/wqflask/wqflask/views.py b/wqflask/wqflask/views.py
index bf2e9026..5f6a431d 100644
--- a/wqflask/wqflask/views.py
+++ b/wqflask/wqflask/views.py
@@ -718,6 +718,8 @@ def mapping_results_page():
         'maf',
         'use_loco',
         'manhattan_plot',
+        'color_scheme',
+        'manhattan_single_color',
         'control_marker',
         'control_marker_db',
         'do_control',