From 127cbe756059dc95e3c37cb2783df5296bafc362 Mon Sep 17 00:00:00 2001 From: Zachary Sloan Date: Mon, 30 Dec 2013 20:22:14 +0000 Subject: Fixed issue where box plots initially appeared below the bar chart instead of in the second tab In the process of trying to fix the genofile to json parser so we can map Amelie's rat data In the process of having the color of bars in the bar chart "follow" them when they are resorted. --- wqflask/wqflask/my_pylmm/data/genofile_parser.py | 14 ++- .../wqflask/static/new/javascript/bar_chart.coffee | 126 ++++++++------------- wqflask/wqflask/static/new/javascript/bar_chart.js | 55 ++++++++- wqflask/wqflask/templates/interval_mapping.html | 1 - .../templates/show_trait_statistics_new.html | 2 +- 5 files changed, 108 insertions(+), 90 deletions(-) diff --git a/wqflask/wqflask/my_pylmm/data/genofile_parser.py b/wqflask/wqflask/my_pylmm/data/genofile_parser.py index 4a647959..af855fb4 100644 --- a/wqflask/wqflask/my_pylmm/data/genofile_parser.py +++ b/wqflask/wqflask/my_pylmm/data/genofile_parser.py @@ -93,12 +93,12 @@ class ConvertGenoFile(object): this_marker = Marker() this_marker.name = row_items[1] this_marker.chr = row_items[0] - this_marker.cM = row_items[2] + #this_marker.cM = row_items[2] if self.mb_exists: - this_marker.Mb = row_items[3] - genotypes = row_items[4:] - else: + this_marker.Mb = row_items[2] genotypes = row_items[3:] + else: + genotypes = row_items[2:] for item_count, genotype in enumerate(genotypes): if genotype.upper() in self.configurations: this_marker.genotypes.append(self.configurations[genotype.upper()]) @@ -186,8 +186,10 @@ if __name__=="__main__": Old_Geno_Directory = """/home/zas1024/gene/web/genotypes/""" New_Geno_Directory = """/home/zas1024/gene/web/new_genotypes/""" #Input_File = """/home/zas1024/gene/web/genotypes/BXD.geno""" - #Output_File = """/home/zas1024/gene/wqflask/wqflask/pylmm/data/bxd.snps""" - ConvertGenoFile.process_all(Old_Geno_Directory, New_Geno_Directory) + #Output_File = """/home/zas1024/gene/wqflask/wqflask/pylmm/data/bxd.snps""" + convertob = ConvertGenoFile("/home/zas1024/gene/web/genotypes/HSNIH.geno.gz", "/home/zas1024/gene/web/new_genotypes/HSNIH.json") + convertob.convert() + #ConvertGenoFile.process_all(Old_Geno_Directory, New_Geno_Directory) #ConvertGenoFiles(Geno_Directory) #process_csv(Input_File, Output_File) \ No newline at end of file diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.coffee b/wqflask/wqflask/static/new/javascript/bar_chart.coffee index e1bb36e1..27a8d284 100644 --- a/wqflask/wqflask/static/new/javascript/bar_chart.coffee +++ b/wqflask/wqflask/static/new/javascript/bar_chart.coffee @@ -129,83 +129,12 @@ class Bar_Chart #$('.x.axis').remove() #@add_x_axis(x_scale) ) - - - - #d3.select(".update_bar_chart").on("click", => - # console.log("THIS IS:", $(this)) - # sort_by = $(this).val() - # console.log("sort_by: ", sort_by) - # if @attributes.length > 0 - # attribute = $("#color_attribute").val() - # if sort_by = "value" - # console.log("sorting by value") - # sortItems = (a, b) -> - # return a[1] - b[1] - # - # @svg.selectAll(".bar") - # .data(@sorted_samples()) - # .transition() - # .duration(1000) - # .attr("y", (d) => - # - # return @y_scale(d[1]) - # ) - # .attr("height", (d) => - # return @plot_height - @y_scale(d[1]) - # ) - # .style("fill", (d) => - # if @attributes.length > 0 - # return @attr_color_dict[attribute][d[2][attribute]] - # else - # return "steelblue" - # ) - # .select("title") - # .text((d) => - # return d[1] - # ) - # sorted_sample_names = (sample[0] for sample in @sorted_samples()) - # x_scale = d3.scale.ordinal() - # .domain(sorted_sample_names) - # .rangeBands([0, @plot_width], .1) - # $('.x.axis').remove() - # @add_x_axis(x_scale) - # else - # console.log("sorting by name") - # #$("#update_bar_chart").html('Sort By Value') - # @svg.selectAll(".bar") - # .data(@samples) - # .transition() - # .duration(1000) - # .attr("y", (d) => - # return @y_scale(d[1]) - # ) - # .attr("height", (d) => - # return @plot_height - @y_scale(d[1]) - # ) - # .style("fill", (d) => - # if @attributes.length > 0 - # return @attr_color_dict[attribute][d[2][attribute]] - # else - # return "steelblue" - # ) - # .select("title") - # .text((d) => - # return d[1] - # ) - # x_scale = d3.scale.ordinal() - # .domain(@sample_names) - # .rangeBands([0, @plot_width], .1) - # $('.x.axis').remove() - # @add_x_axis(x_scale) - #) - + d3.select("#color_by_trait").on("click", => @open_trait_selection() ) - rebuild_bar_graph: (samples) -> console.log("samples:", samples) @svg.selectAll(".bar") @@ -223,7 +152,11 @@ class Bar_Chart return d[1] ) .style("fill", (d) => - if @attributes.length > 0 and @attribute != "None" + if @attributes.length == 0 + console.log("SAMPLE:", d[0]) + console.log("CHECKING:", @trait_color_dict[d[0]]) + return @trait_color_dict[d[0]] + else if @attributes.length > 0 and @attribute != "None" console.log("@attribute:", @attribute) console.log("d[2]", d[2]) console.log("the_color:", @attr_color_dict[@attribute][d[2][@attribute]]) @@ -231,6 +164,10 @@ class Bar_Chart else return "steelblue" ) + #.style("fill", (d) => + # return @trait_color_dict[d[0]] + # #return @attr_color_dict["collection_trait"][trimmed_samples[d[0]]] + #) sample_names = (sample[0] for sample in samples) console.log("sample_names2:", sample_names) x_scale = d3.scale.ordinal() @@ -268,6 +205,35 @@ class Bar_Chart #this_color_dict[value] = d3.rgb("lightblue").darker(color_range(parseInt(value))) #this_color_dict[value] = "rgb(0, 0, " + color_range(parseInt(value)) + ")" @attr_color_dict[key] = this_color_dict + + get_trait_color_dict: (samples, vals) -> + @trait_color_dict = {} + console.log("vals:", vals) + for own key, distinct_vals of vals + this_color_dict = {} + if distinct_vals.length < 10 + color = d3.scale.category10() + for value, i in distinct_vals + this_color_dict[value] = color(i) + else + console.log("distinct_values:", distinct_vals) + #Check whether all values are numbers, and if they are get a corresponding + #color gradient + if _.every(distinct_vals, (d) => + if isNaN(d) + return false + else + return true + ) + color_range = d3.scale.linear() + .domain([d3.min(distinct_vals), + d3.max(distinct_vals)]) + .range([0,255]) + for value, i in distinct_vals + console.log("color_range(value):", parseInt(color_range(value))) + this_color_dict[value] = d3.rgb(parseInt(color_range(value)),0, 0) + for own sample, value of samples + @trait_color_dict[sample] = this_color_dict[value] convert_into_colors: (values) -> color_range = d3.scale.linear() @@ -450,14 +416,17 @@ class Bar_Chart trimmed_samples = @trim_values(trait_sample_data) distinct_values = {} distinct_values["collection_trait"] = @get_distinct_values(trimmed_samples) - @get_attr_color_dict(distinct_values) + #@get_attr_color_dict(distinct_values) + @get_trait_color_dict(trimmed_samples, distinct_values) + console.log("TRAIT_COLOR_DICT:", @trait_color_dict) if $("#update_bar_chart").html() == 'Sort By Name' @svg.selectAll(".bar") .data(@sorted_samples()) .transition() .duration(1000) .style("fill", (d) => - return @attr_color_dict["collection_trait"][trimmed_samples[d[0]]] + return @trait_color_dict[d[0]] + #return @attr_color_dict["collection_trait"][trimmed_samples[d[0]]] ) .select("title") .text((d) => @@ -469,10 +438,11 @@ class Bar_Chart .transition() .duration(1000) .style("fill", (d) => - return @attr_color_dict["collection_trait"][trimmed_samples[d[0]]] + return @trait_color_dict[d[0]] + #return @attr_color_dict["collection_trait"][trimmed_samples[d[0]]] ) - - + + trim_values: (trait_sample_data) -> trimmed_samples = {} for sample in @sample_names diff --git a/wqflask/wqflask/static/new/javascript/bar_chart.js b/wqflask/wqflask/static/new/javascript/bar_chart.js index b02ee1da..faf66cd4 100644 --- a/wqflask/wqflask/static/new/javascript/bar_chart.js +++ b/wqflask/wqflask/static/new/javascript/bar_chart.js @@ -102,7 +102,11 @@ }).select("title").text(function(d) { return d[1]; }).style("fill", function(d) { - if (_this.attributes.length > 0 && _this.attribute !== "None") { + if (_this.attributes.length === 0) { + console.log("SAMPLE:", d[0]); + console.log("CHECKING:", _this.trait_color_dict[d[0]]); + return _this.trait_color_dict[d[0]]; + } else if (_this.attributes.length > 0 && _this.attribute !== "None") { console.log("@attribute:", _this.attribute); console.log("d[2]", d[2]); console.log("the_color:", _this.attr_color_dict[_this.attribute][d[2][_this.attribute]]); @@ -164,6 +168,48 @@ return _results; }; + Bar_Chart.prototype.get_trait_color_dict = function(samples, vals) { + var color, color_range, distinct_vals, i, key, sample, this_color_dict, value, _i, _j, _len, _len1, _results, + _this = this; + this.trait_color_dict = {}; + console.log("vals:", vals); + for (key in vals) { + if (!__hasProp.call(vals, key)) continue; + distinct_vals = vals[key]; + this_color_dict = {}; + if (distinct_vals.length < 10) { + color = d3.scale.category10(); + for (i = _i = 0, _len = distinct_vals.length; _i < _len; i = ++_i) { + value = distinct_vals[i]; + this_color_dict[value] = color(i); + } + } else { + console.log("distinct_values:", distinct_vals); + if (_.every(distinct_vals, function(d) { + if (isNaN(d)) { + return false; + } else { + return true; + } + })) { + color_range = d3.scale.linear().domain([d3.min(distinct_vals), d3.max(distinct_vals)]).range([0, 255]); + for (i = _j = 0, _len1 = distinct_vals.length; _j < _len1; i = ++_j) { + value = distinct_vals[i]; + console.log("color_range(value):", parseInt(color_range(value))); + this_color_dict[value] = d3.rgb(parseInt(color_range(value)), 0, 0); + } + } + } + } + _results = []; + for (sample in samples) { + if (!__hasProp.call(samples, sample)) continue; + value = samples[sample]; + _results.push(this.trait_color_dict[sample] = this_color_dict[value]); + } + return _results; + }; + Bar_Chart.prototype.convert_into_colors = function(values) { var color_range, i, value, _i, _len, _results; color_range = d3.scale.linear().domain([d3.min(values), d3.max(values)]).range([0, 255]); @@ -346,16 +392,17 @@ trimmed_samples = this.trim_values(trait_sample_data); distinct_values = {}; distinct_values["collection_trait"] = this.get_distinct_values(trimmed_samples); - this.get_attr_color_dict(distinct_values); + this.get_trait_color_dict(trimmed_samples, distinct_values); + console.log("TRAIT_COLOR_DICT:", this.trait_color_dict); if ($("#update_bar_chart").html() === 'Sort By Name') { return this.svg.selectAll(".bar").data(this.sorted_samples()).transition().duration(1000).style("fill", function(d) { - return _this.attr_color_dict["collection_trait"][trimmed_samples[d[0]]]; + return _this.trait_color_dict[d[0]]; }).select("title").text(function(d) { return d[1]; }); } else { return this.svg.selectAll(".bar").data(this.samples).transition().duration(1000).style("fill", function(d) { - return _this.attr_color_dict["collection_trait"][trimmed_samples[d[0]]]; + return _this.trait_color_dict[d[0]]; }); } }; diff --git a/wqflask/wqflask/templates/interval_mapping.html b/wqflask/wqflask/templates/interval_mapping.html index e4e08388..e4b93bf4 100644 --- a/wqflask/wqflask/templates/interval_mapping.html +++ b/wqflask/wqflask/templates/interval_mapping.html @@ -77,7 +77,6 @@ -