Have marker regression results displaying as a scatterplot (just the points)

using d3.js

5 files changed, 310 insertions, 427 deletions

diff --git a/wqflask/base/data_set.py b/wqflask/base/data_set.py
index d4e97370..0b3b5248 100755
--- a/wqflask/base/data_set.py
+++ b/wqflask/base/data_set.py
@@ -77,9 +77,11 @@ class Markers(object):
     def add_pvalues(self, p_values):
         for marker, p_value in itertools.izip(self.markers, p_values):
             marker['p_value'] = p_value
+            marker['lod_score'] = -math.log10(marker['p_value'])
             #Using -log(p) for the LRS; need to ask Rob how he wants to get LRS from p-values
             marker['lrs_value'] = -math.log10(marker['p_value']) * 4.61
 
+
 class DatasetGroup(object):
     """
     Each group has multiple datasets; each species has multiple groups.
diff --git a/wqflask/wqflask/static/new/javascript/marker_regression.coffee b/wqflask/wqflask/static/new/javascript/marker_regression.coffee
index 7eb62ec1..6a10d95e 100644
--- a/wqflask/wqflask/static/new/javascript/marker_regression.coffee
+++ b/wqflask/wqflask/static/new/javascript/marker_regression.coffee
@@ -1,212 +1,56 @@
 $ ->
-    sort_number = (a, b) ->
-        return a - b
 
-
-    class Permutation_Histogram
-        constructor: ->
-            @process_data()
-            @display_graph()
-            
-        process_data: ->
-            # Put the data in a format needed for graphing 
-            # The permutation count for a particular integer range (10-11 or 12-13 for example)
-            # will be on the y-axis; LRS values will be on the x-axis
-            lrs_array = js_data.lrs_array
-            bars = {}
-            for lrs in lrs_array
-                floored = Math.floor(lrs)
-                if floored not of bars
-                    bars[floored] = 0
-                bars[floored] += 1
-    
-            # Now we need to take the unordered hash
-            # And order the keys
-            keys = []
-            for key of bars
-                keys.push(key)
-        
-            keys.sort(sort_number)
-            
-    
-            # Now that we have the ordered keys above
-            # We can build an array of arrays that jqPlot will use
-            @bars_ordered = []
-            for key in keys
-                @bars_ordered.push([parseInt(key), bars[key]])
+    x_coords = []
+    y_coords = []
     
-            console.log("bars is:", bars)
-            console.log("keys are:", keys)
-            console.log("bars_ordered are:", @bars_ordered)
-            #return bars_ordered
-    
-        display_graph: ->
-        
-            $.jqplot('permutation_histogram',  [@bars_ordered],
-                title: 'Permutation Histogram'     
-                seriesDefaults:
-                    renderer:$.jqplot.BarRenderer
-                    rendererOptions: 
-                        barWidth: 15
-                    pointLabels: 
-                        show: true
-                axesDefaults:
-                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer
-                axes: 
-                    xaxis: 
-                      min: 0
-                      label: "LRS"
-                      pad: 1.1
-                    yaxis:
-                      min: 0
-                      label: "Frequency"
-            )
-        
-    #process_qtl_results = ->
-    #    qtl_results = js_data.qtl_results
-        
-    #display_manhattan_plot = ->
-
-
-
-    #bars_ordered = process_lrs_array()
-    #display_permutation_histogram(bars_ordered)
-    
-    class Chromosome
-        constructor:  (@name) ->
-            @max_mb = 0
-            @plot_points = []
-            
-        process_point: (mb, lrs) ->
-            if mb > @max_mb
-                @max_mb = mb
-            @plot_points.push([mb, lrs])
-            
-        display_graph: (max_lrs) ->
-            div_name = 'manhattan_plot_' + @name
-            console.log("div_name:", div_name)
-        
-            #console.log("max_lrs is", max_lrs)
-        
-        
-            x_axis_max = Math.ceil(@max_mb/25) * 25
-            x_axis_ticks = []
-            x_tick = 0
-            while (x_tick <= x_axis_max)
-                x_axis_ticks.push(x_tick)
-                x_tick += 25
-                
-            
-            plot_options = 
-                title: @name
-                seriesDefaults:
-                    showLine: false
-                    markerRenderer: $.jqplot.MarkerRenderer
-                    markerOptions:
-                        style: "filledCircle"
-                        size: 3
-                axesDefaults:
-                    tickRenderer: $.jqplot.CanvasAxisTickRenderer
-                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer
-                axes: 
-                    xaxis: 
-                        min: 0
-                        max: x_axis_max
-                        ticks: x_axis_ticks
-                        tickOptions:
-                            angle: 90
-                            showGridline: false
-                            formatString: '%d' 
-                        label: "Megabases"
-
-            
-            if @name == "1"
-                plot_options.axes.yaxis =
-                    min: 0
-                    max: Math.floor(max_lrs + 0.1 * max_lrs)
-                    tickInterval: 1
-                    label: "LRS"
-                    tickOptions:
-                        formatString: '%d' 
-                        showGridline: false    
-            else
-                plot_options.axes.yaxis =
-                    show: false
-                    min: 0
-                    max: Math.floor(max_lrs + 0.1 * max_lrs)
-                    tickInterval: 1
-                    tickOptions:
-                        formatString: '%d' 
-                        showGridline: false                        
-                    
-            $.jqplot(div_name,  [@plot_points], plot_options)
-
-    class Manhattan_Plot
-        constructor: ->
-            @max_lrs = 0
-            
-            @chromosomes = {}   
-            @build_chromosomes()
-            
-            @display_graphs()
-
-        build_chromosomes: ->
-            for result in js_data.qtl_results
-                #if result.locus.chromosome == '1'
-                chromosome = result.locus.chromosome
-                if chromosome not of @chromosomes
-                    @chromosomes[chromosome] = new Chromosome(chromosome)
-                mb = parseInt(result.locus.mb)
-                if result.lrs > @max_lrs
-                    @max_lrs = result.lrs
-                @chromosomes[chromosome].process_point(mb, result.lrs)
-
-        display_graphs: ->
-            ### Call display_graph for each chromosome ###
-            
-            # First get everything in the right order
-            numbered_keys = []
-            extra_keys = []
-            for key of @chromosomes
-                if isNaN(key)
-                    extra_keys.push(key)
-                else
-                    numbered_keys.push(key)
-        
-            numbered_keys.sort(sort_number)
-            extra_keys.sort()
-            keys = numbered_keys.concat(extra_keys)
-            console.log("keys are:", keys)
-            
-            for key in keys
-                this_class = "manhattan_plot_segment"
-                if key != "1"
-                    this_class += " no_y_axis"
-                html = """<div id="manhattan_plot_#{ key }" class=#{ this_class }></div>"""
-                console.log("html is:", html)
-                $("#manhattan_plots").append(html)
-                @chromosomes[key].display_graph(@max_lrs)
-
-            $('.jqplot-yaxis').hide()
-            $('#manhattan_plot_1').find('.jqplot-yaxis').show()
-            
-            #$(".jqplot-yaxis").hide()
-            #$(".jqplot-yaxis-tick").hide()
-            
-            
-        #process_data: ->
-        #    qtl_results = js_data.qtl_results
-        #    #console.log("qtl_results: ", qtl_results)
-        #    @plot_points = []
-        #    @max_mb = 0
-        #    for result in qtl_results
-        #        if result.locus.chromosome == '1'
-        #            mb = parseInt(result.locus.mb)
-        #            if mb > @max_mb
-        #                @max_mb = mb
-        #            @plot_points.push([mb, result.lrs])
+    largest_chr = 0
+    for result in js_data.qtl_results
+        chr = parseInt(result.chr)
+        console.log("foo:", chr, typeof(chr))
+        if _.isNaN(chr) 
+            console.log("Got NaN")
+        else
+            if chr > largest_chr
+                largest_chr = chr
                 
-
-
-    new Permutation_Histogram
-    new Manhattan_Plot
\ No newline at end of file
+    console.log("largest_chr is:", largest_chr)
+    
+    for result in js_data.qtl_results
+        chr = parseInt(result.chr)
+        if _.isNaN(chr)
+            if result.chr == "X"
+                chr = largest_chr + 1
+            else if result.chr == "Y"
+                chr = largest_chr + 2
+
+        x_coords.push((chr * 200) + parseFloat(result.Mb))
+        y_coords.push(result.lrs_value)
+        #plot_coordinates.push([x_coord, y_coord])
+
+    x_max = d3.max(x_coords)
+    y_max = d3.max(y_coords)
+        
+    plot_coordinates = _.zip(x_coords, y_coords)
+        
+    console.log(plot_coordinates)
+        
+    svg = d3.select("#manhattan_plots")
+                .append("svg")
+                .attr("width", 1000)
+                .attr("height", 800)
+                #.attr("transform", "translate(0," + y_max + ")")
+                #.attr("transform", "scale(1,-1)")
+
+
+    svg.selectAll("circle")
+        .data(plot_coordinates)
+        .enter()
+        .append("circle")
+        .attr("cx", (d) =>
+            return (1000 * d[0]/x_max)
+             #return ((900 * (d[0]/x_max)) + 50)
+        )
+        .attr("cy", (d) =>
+             return 800 - (600 * d[1]/y_max)
+        )
+        .attr("r", 3)
\ No newline at end of file
diff --git a/wqflask/wqflask/static/new/javascript/marker_regression.js b/wqflask/wqflask/static/new/javascript/marker_regression.js
index 19a7d051..d231ba5b 100644
--- a/wqflask/wqflask/static/new/javascript/marker_regression.js
+++ b/wqflask/wqflask/static/new/javascript/marker_regression.js
@@ -2,225 +2,49 @@
 (function() {
 
   $(function() {
-    var Chromosome, Manhattan_Plot, Permutation_Histogram, sort_number;
-    sort_number = function(a, b) {
-      return a - b;
-    };
-    Permutation_Histogram = (function() {
-
-      function Permutation_Histogram() {
-        this.process_data();
-        this.display_graph();
-      }
-
-      Permutation_Histogram.prototype.process_data = function() {
-        var bars, floored, key, keys, lrs, lrs_array, _i, _j, _len, _len1;
-        lrs_array = js_data.lrs_array;
-        bars = {};
-        for (_i = 0, _len = lrs_array.length; _i < _len; _i++) {
-          lrs = lrs_array[_i];
-          floored = Math.floor(lrs);
-          if (!(floored in bars)) {
-            bars[floored] = 0;
-          }
-          bars[floored] += 1;
+    var chr, largest_chr, plot_coordinates, result, svg, x_coords, x_max, y_coords, y_max, _i, _j, _len, _len1, _ref, _ref1,
+      _this = this;
+    x_coords = [];
+    y_coords = [];
+    largest_chr = 0;
+    _ref = js_data.qtl_results;
+    for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+      result = _ref[_i];
+      chr = parseInt(result.chr);
+      console.log("foo:", chr, typeof chr);
+      if (_.isNaN(chr)) {
+        console.log("Got NaN");
+      } else {
+        if (chr > largest_chr) {
+          largest_chr = chr;
         }
-        keys = [];
-        for (key in bars) {
-          keys.push(key);
-        }
-        keys.sort(sort_number);
-        this.bars_ordered = [];
-        for (_j = 0, _len1 = keys.length; _j < _len1; _j++) {
-          key = keys[_j];
-          this.bars_ordered.push([parseInt(key), bars[key]]);
-        }
-        console.log("bars is:", bars);
-        console.log("keys are:", keys);
-        return console.log("bars_ordered are:", this.bars_ordered);
-      };
-
-      Permutation_Histogram.prototype.display_graph = function() {
-        return $.jqplot('permutation_histogram', [this.bars_ordered], {
-          title: 'Permutation Histogram',
-          seriesDefaults: {
-            renderer: $.jqplot.BarRenderer,
-            rendererOptions: {
-              barWidth: 15
-            },
-            pointLabels: {
-              show: true
-            }
-          },
-          axesDefaults: {
-            labelRenderer: $.jqplot.CanvasAxisLabelRenderer
-          },
-          axes: {
-            xaxis: {
-              min: 0,
-              label: "LRS",
-              pad: 1.1
-            },
-            yaxis: {
-              min: 0,
-              label: "Frequency"
-            }
-          }
-        });
-      };
-
-      return Permutation_Histogram;
-
-    })();
-    Chromosome = (function() {
-
-      function Chromosome(name) {
-        this.name = name;
-        this.max_mb = 0;
-        this.plot_points = [];
       }
-
-      Chromosome.prototype.process_point = function(mb, lrs) {
-        if (mb > this.max_mb) {
-          this.max_mb = mb;
-        }
-        return this.plot_points.push([mb, lrs]);
-      };
-
-      Chromosome.prototype.display_graph = function(max_lrs) {
-        var div_name, plot_options, x_axis_max, x_axis_ticks, x_tick;
-        div_name = 'manhattan_plot_' + this.name;
-        console.log("div_name:", div_name);
-        x_axis_max = Math.ceil(this.max_mb / 25) * 25;
-        x_axis_ticks = [];
-        x_tick = 0;
-        while (x_tick <= x_axis_max) {
-          x_axis_ticks.push(x_tick);
-          x_tick += 25;
+    }
+    console.log("largest_chr is:", largest_chr);
+    _ref1 = js_data.qtl_results;
+    for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
+      result = _ref1[_j];
+      chr = parseInt(result.chr);
+      if (_.isNaN(chr)) {
+        if (result.chr === "X") {
+          chr = largest_chr + 1;
+        } else if (result.chr === "Y") {
+          chr = largest_chr + 2;
         }
-        plot_options = {
-          title: this.name,
-          seriesDefaults: {
-            showLine: false,
-            markerRenderer: $.jqplot.MarkerRenderer,
-            markerOptions: {
-              style: "filledCircle",
-              size: 3
-            }
-          },
-          axesDefaults: {
-            tickRenderer: $.jqplot.CanvasAxisTickRenderer,
-            labelRenderer: $.jqplot.CanvasAxisLabelRenderer
-          },
-          axes: {
-            xaxis: {
-              min: 0,
-              max: x_axis_max,
-              ticks: x_axis_ticks,
-              tickOptions: {
-                angle: 90,
-                showGridline: false,
-                formatString: '%d'
-              },
-              label: "Megabases"
-            }
-          }
-        };
-        if (this.name === "1") {
-          plot_options.axes.yaxis = {
-            min: 0,
-            max: Math.floor(max_lrs + 0.1 * max_lrs),
-            tickInterval: 1,
-            label: "LRS",
-            tickOptions: {
-              formatString: '%d',
-              showGridline: false
-            }
-          };
-        } else {
-          plot_options.axes.yaxis = {
-            show: false,
-            min: 0,
-            max: Math.floor(max_lrs + 0.1 * max_lrs),
-            tickInterval: 1,
-            tickOptions: {
-              formatString: '%d',
-              showGridline: false
-            }
-          };
-        }
-        return $.jqplot(div_name, [this.plot_points], plot_options);
-      };
-
-      return Chromosome;
-
-    })();
-    Manhattan_Plot = (function() {
-
-      function Manhattan_Plot() {
-        this.max_lrs = 0;
-        this.chromosomes = {};
-        this.build_chromosomes();
-        this.display_graphs();
       }
-
-      Manhattan_Plot.prototype.build_chromosomes = function() {
-        var chromosome, mb, result, _i, _len, _ref, _results;
-        _ref = js_data.qtl_results;
-        _results = [];
-        for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-          result = _ref[_i];
-          chromosome = result.locus.chromosome;
-          if (!(chromosome in this.chromosomes)) {
-            this.chromosomes[chromosome] = new Chromosome(chromosome);
-          }
-          mb = parseInt(result.locus.mb);
-          if (result.lrs > this.max_lrs) {
-            this.max_lrs = result.lrs;
-          }
-          _results.push(this.chromosomes[chromosome].process_point(mb, result.lrs));
-        }
-        return _results;
-      };
-
-      Manhattan_Plot.prototype.display_graphs = function() {
-        /* Call display_graph for each chromosome
-        */
-
-        var extra_keys, html, key, keys, numbered_keys, this_class, _i, _len;
-        numbered_keys = [];
-        extra_keys = [];
-        for (key in this.chromosomes) {
-          if (isNaN(key)) {
-            extra_keys.push(key);
-          } else {
-            numbered_keys.push(key);
-          }
-        }
-        numbered_keys.sort(sort_number);
-        extra_keys.sort();
-        keys = numbered_keys.concat(extra_keys);
-        console.log("keys are:", keys);
-        for (_i = 0, _len = keys.length; _i < _len; _i++) {
-          key = keys[_i];
-          this_class = "manhattan_plot_segment";
-          if (key !== "1") {
-            this_class += " no_y_axis";
-          }
-          html = "<div id=\"manhattan_plot_" + key + "\" class=" + this_class + "></div>";
-          console.log("html is:", html);
-          $("#manhattan_plots").append(html);
-          this.chromosomes[key].display_graph(this.max_lrs);
-        }
-        $('.jqplot-yaxis').hide();
-        return $('#manhattan_plot_1').find('.jqplot-yaxis').show();
-      };
-
-      return Manhattan_Plot;
-
-    })();
-    new Permutation_Histogram;
-    return new Manhattan_Plot;
+      x_coords.push((chr * 200) + parseFloat(result.Mb));
+      y_coords.push(result.lrs_value);
+    }
+    x_max = d3.max(x_coords);
+    y_max = d3.max(y_coords);
+    plot_coordinates = _.zip(x_coords, y_coords);
+    console.log(plot_coordinates);
+    svg = d3.select("#manhattan_plots").append("svg").attr("width", 1000).attr("height", 800);
+    return svg.selectAll("circle").data(plot_coordinates).enter().append("circle").attr("cx", function(d) {
+      return 1000 * d[0] / x_max;
+    }).attr("cy", function(d) {
+      return 800 - (600 * d[1] / y_max);
+    }).attr("r", 3);
   });
 
 }).call(this);
diff --git a/wqflask/wqflask/static/new/javascript/marker_regression_old.coffee b/wqflask/wqflask/static/new/javascript/marker_regression_old.coffee
new file mode 100644
index 00000000..7eb62ec1
--- /dev/null
+++ b/wqflask/wqflask/static/new/javascript/marker_regression_old.coffee
@@ -0,0 +1,212 @@
+$ ->
+    sort_number = (a, b) ->
+        return a - b
+
+
+    class Permutation_Histogram
+        constructor: ->
+            @process_data()
+            @display_graph()
+            
+        process_data: ->
+            # Put the data in a format needed for graphing 
+            # The permutation count for a particular integer range (10-11 or 12-13 for example)
+            # will be on the y-axis; LRS values will be on the x-axis
+            lrs_array = js_data.lrs_array
+            bars = {}
+            for lrs in lrs_array
+                floored = Math.floor(lrs)
+                if floored not of bars
+                    bars[floored] = 0
+                bars[floored] += 1
+    
+            # Now we need to take the unordered hash
+            # And order the keys
+            keys = []
+            for key of bars
+                keys.push(key)
+        
+            keys.sort(sort_number)
+            
+    
+            # Now that we have the ordered keys above
+            # We can build an array of arrays that jqPlot will use
+            @bars_ordered = []
+            for key in keys
+                @bars_ordered.push([parseInt(key), bars[key]])
+    
+            console.log("bars is:", bars)
+            console.log("keys are:", keys)
+            console.log("bars_ordered are:", @bars_ordered)
+            #return bars_ordered
+    
+        display_graph: ->
+        
+            $.jqplot('permutation_histogram',  [@bars_ordered],
+                title: 'Permutation Histogram'     
+                seriesDefaults:
+                    renderer:$.jqplot.BarRenderer
+                    rendererOptions: 
+                        barWidth: 15
+                    pointLabels: 
+                        show: true
+                axesDefaults:
+                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer
+                axes: 
+                    xaxis: 
+                      min: 0
+                      label: "LRS"
+                      pad: 1.1
+                    yaxis:
+                      min: 0
+                      label: "Frequency"
+            )
+        
+    #process_qtl_results = ->
+    #    qtl_results = js_data.qtl_results
+        
+    #display_manhattan_plot = ->
+
+
+
+    #bars_ordered = process_lrs_array()
+    #display_permutation_histogram(bars_ordered)
+    
+    class Chromosome
+        constructor:  (@name) ->
+            @max_mb = 0
+            @plot_points = []
+            
+        process_point: (mb, lrs) ->
+            if mb > @max_mb
+                @max_mb = mb
+            @plot_points.push([mb, lrs])
+            
+        display_graph: (max_lrs) ->
+            div_name = 'manhattan_plot_' + @name
+            console.log("div_name:", div_name)
+        
+            #console.log("max_lrs is", max_lrs)
+        
+        
+            x_axis_max = Math.ceil(@max_mb/25) * 25
+            x_axis_ticks = []
+            x_tick = 0
+            while (x_tick <= x_axis_max)
+                x_axis_ticks.push(x_tick)
+                x_tick += 25
+                
+            
+            plot_options = 
+                title: @name
+                seriesDefaults:
+                    showLine: false
+                    markerRenderer: $.jqplot.MarkerRenderer
+                    markerOptions:
+                        style: "filledCircle"
+                        size: 3
+                axesDefaults:
+                    tickRenderer: $.jqplot.CanvasAxisTickRenderer
+                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer
+                axes: 
+                    xaxis: 
+                        min: 0
+                        max: x_axis_max
+                        ticks: x_axis_ticks
+                        tickOptions:
+                            angle: 90
+                            showGridline: false
+                            formatString: '%d' 
+                        label: "Megabases"
+
+            
+            if @name == "1"
+                plot_options.axes.yaxis =
+                    min: 0
+                    max: Math.floor(max_lrs + 0.1 * max_lrs)
+                    tickInterval: 1
+                    label: "LRS"
+                    tickOptions:
+                        formatString: '%d' 
+                        showGridline: false    
+            else
+                plot_options.axes.yaxis =
+                    show: false
+                    min: 0
+                    max: Math.floor(max_lrs + 0.1 * max_lrs)
+                    tickInterval: 1
+                    tickOptions:
+                        formatString: '%d' 
+                        showGridline: false                        
+                    
+            $.jqplot(div_name,  [@plot_points], plot_options)
+
+    class Manhattan_Plot
+        constructor: ->
+            @max_lrs = 0
+            
+            @chromosomes = {}   
+            @build_chromosomes()
+            
+            @display_graphs()
+
+        build_chromosomes: ->
+            for result in js_data.qtl_results
+                #if result.locus.chromosome == '1'
+                chromosome = result.locus.chromosome
+                if chromosome not of @chromosomes
+                    @chromosomes[chromosome] = new Chromosome(chromosome)
+                mb = parseInt(result.locus.mb)
+                if result.lrs > @max_lrs
+                    @max_lrs = result.lrs
+                @chromosomes[chromosome].process_point(mb, result.lrs)
+
+        display_graphs: ->
+            ### Call display_graph for each chromosome ###
+            
+            # First get everything in the right order
+            numbered_keys = []
+            extra_keys = []
+            for key of @chromosomes
+                if isNaN(key)
+                    extra_keys.push(key)
+                else
+                    numbered_keys.push(key)
+        
+            numbered_keys.sort(sort_number)
+            extra_keys.sort()
+            keys = numbered_keys.concat(extra_keys)
+            console.log("keys are:", keys)
+            
+            for key in keys
+                this_class = "manhattan_plot_segment"
+                if key != "1"
+                    this_class += " no_y_axis"
+                html = """<div id="manhattan_plot_#{ key }" class=#{ this_class }></div>"""
+                console.log("html is:", html)
+                $("#manhattan_plots").append(html)
+                @chromosomes[key].display_graph(@max_lrs)
+
+            $('.jqplot-yaxis').hide()
+            $('#manhattan_plot_1').find('.jqplot-yaxis').show()
+            
+            #$(".jqplot-yaxis").hide()
+            #$(".jqplot-yaxis-tick").hide()
+            
+            
+        #process_data: ->
+        #    qtl_results = js_data.qtl_results
+        #    #console.log("qtl_results: ", qtl_results)
+        #    @plot_points = []
+        #    @max_mb = 0
+        #    for result in qtl_results
+        #        if result.locus.chromosome == '1'
+        #            mb = parseInt(result.locus.mb)
+        #            if mb > @max_mb
+        #                @max_mb = mb
+        #            @plot_points.push([mb, result.lrs])
+                
+
+
+    new Permutation_Histogram
+    new Manhattan_Plot
\ No newline at end of file
diff --git a/wqflask/wqflask/templates/marker_regression.html b/wqflask/wqflask/templates/marker_regression.html
index 6b0a4813..0c537d19 100644
--- a/wqflask/wqflask/templates/marker_regression.html
+++ b/wqflask/wqflask/templates/marker_regression.html
@@ -36,7 +36,7 @@
                 {% for marker in filtered_results %}
                 <tr>
                     <td>{{loop.index}}</td>
-                    <td>{{marker.lrs_value}}</td>
+                    <td>{{marker.lod_score}}</td>
                     <td>{{marker.chr}}</td>
                     <td>{{marker.Mb}}</td>
                     <td>{{marker.name}}</td>
@@ -59,6 +59,7 @@
     <!--[if lt IE 9]>
         <script language="javascript" type="text/javascript" src="/static/packages/jqplot/excanvas.js"></script>
     <![endif]-->
+    <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
     <script language="javascript" type="text/javascript" src="/static/packages/jqplot/jquery.jqplot.min.js"></script>
     <script language="javascript" type="text/javascript" src="/static/packages/jqplot/plugins/jqplot.pointLabels.min.js"></script>
     <script language="javascript" type="text/javascript" src="/static/packages/jqplot/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
@@ -66,13 +67,13 @@
     <!--<script language="javascript" type="text/javascript" src="/static/packages/jqplot/plugins/jqplot.markerRenderer.min.js"></script>-->
     <script language="javascript" type="text/javascript" src="/static/packages/jqplot/plugins/jqplot.canvasTextRenderer.min.js"></script>
     <script language="javascript" type="text/javascript" src="/static/packages/jqplot/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
-    <!--<script language="javascript" type="text/javascript" src="/static/new/javascript/marker_regression.js"></script>-->
+    <script language="javascript" type="text/javascript" src="/static/new/javascript/marker_regression.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/underscore/underscore-min.js"></script>
     
- 
         
     
     <script type="text/javascript" charset="utf-8">
@@ -81,7 +82,7 @@
                 "iDisplayLength": 50
             } );            
             
-                 $('#qtl_results').dataTable();
+            $('#qtl_results').dataTable();
          } );
     </script>
 {% endblock %}
\ No newline at end of file