aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee55
-rw-r--r--wqflask/wqflask/static/new/javascript/draw_probability_plot.js49
-rwxr-xr-xwqflask/wqflask/static/new/javascript/show_trait.coffee11
-rwxr-xr-xwqflask/wqflask/static/new/javascript/show_trait.js10
-rwxr-xr-xwqflask/wqflask/templates/show_trait_statistics_new.html24
5 files changed, 109 insertions, 40 deletions
diff --git a/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee b/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee
index 345cbd19..fab53b1d 100644
--- a/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee
+++ b/wqflask/wqflask/static/new/javascript/draw_probability_plot.coffee
@@ -11,8 +11,10 @@ get_z_scores = (n) ->
return (jStat.normal.inv(x, 0, 1) for x in osm_uniform)
-# input: dictionary sample name -> sample value
-redraw_prob_plot = (samples) ->
+# samples is {'samples_primary': {'name1': value1, ...},
+# 'samples_other': {'nameN': valueN, ...},
+# 'samples_all': {'name1': value1, ...}}
+redraw_prob_plot = (samples, sample_group) ->
h = 600
w = 600
margin = {left:60, top:40, right:40, bottom: 40, inner:5}
@@ -24,20 +26,33 @@ redraw_prob_plot = (samples) ->
container.height(totalh)
nv.addGraph(() =>
- chart = nv.models.scatterChart().width(w).height(h).showLegend(false)
+ chart = nv.models.scatterChart()
+ .width(w)
+ .height(h)
+ .showLegend(true)
+ .color(d3.scale.category10().range())
+
+ # size settings are quite counter-intuitive in NVD3!
+ chart.pointRange([50,50]) # (50 is the area, not radius)
+
+ chart.legend.updateState(false)
+
chart.xAxis
.axisLabel("Theoretical quantiles")
- .tickFormat(d3.format('.02f'));
+ .tickFormat(d3.format('.02f'))
+
chart.yAxis
.axisLabel("Sample quantiles")
- .tickFormat(d3.format('.02f'));
+ .tickFormat(d3.format('.02f'))
+
chart.tooltipContent((obj) =>
- return '<b style="font-size: 20px">' + obj.point.name + '</b>';
+ return '<b style="font-size: 20px">' + obj.point.name + '</b>'
)
- names = (x for x in _.keys(samples) when samples[x] != null)
- sorted_names = names.sort((x, y) => samples[x] - samples[y])
- sorted_values = (samples[x] for x in sorted_names)
+ all_samples = samples[sample_group]
+ names = (x for x in _.keys(all_samples) when samples[x] != null)
+ sorted_names = names.sort((x, y) => all_samples[x] - all_samples[y])
+ sorted_values = (all_samples[x] for x in sorted_names)
sw_result = ShapiroWilkW(sorted_values)
W = sw_result.w.toFixed(3)
pvalue = sw_result.p.toFixed(3)
@@ -46,22 +61,32 @@ redraw_prob_plot = (samples) ->
else\
"<span style='color:red'>"+pvalue+"</span>"
test_str = "Shapiro-Wilk test statistic is #{W} (p = #{pvalue_str})"
- data = [{
- slope: jStat.stdev(sorted_values),
- intercept: jStat.mean(sorted_values),
- size: 10,
+
+ z_scores = get_z_scores(sorted_values.length)
+ slope = jStat.stdev(sorted_values)
+ intercept = jStat.mean(sorted_values)
+
+ make_data = (group_name) ->
+ return {
+ key: js_data.sample_group_types[group_name],
+ slope: slope,
+ intercept: intercept,
values: ({x: z_score, y: value, name: sample}\
for [z_score, value, sample] in\
_.zip(get_z_scores(sorted_values.length),
sorted_values,
- sorted_names))
- }]
+ sorted_names)\
+ when sample of samples[group_name])
+ }
+
+ data = [make_data('samples_primary'), make_data('samples_other')]
console.log("THE DATA IS:", data)
d3.select("#prob_plot_container svg")
.datum(data)
.call(chart)
$("#prob_plot_title").html("<h3>Normal probability plot</h3>"+test_str)
+ $("#prob_plot_container .nv-legendWrap").toggle(sample_group == "samples_all")
return chart
)
diff --git a/wqflask/wqflask/static/new/javascript/draw_probability_plot.js b/wqflask/wqflask/static/new/javascript/draw_probability_plot.js
index 43dda849..b301b97f 100644
--- a/wqflask/wqflask/static/new/javascript/draw_probability_plot.js
+++ b/wqflask/wqflask/static/new/javascript/draw_probability_plot.js
@@ -23,7 +23,7 @@
})();
};
- redraw_prob_plot = function(samples) {
+ redraw_prob_plot = function(samples, sample_group) {
var container, h, margin, totalh, totalw, w;
h = 600;
w = 600;
@@ -41,16 +41,19 @@
container.height(totalh);
return nv.addGraph((function(_this) {
return function() {
- var W, chart, data, names, pvalue, pvalue_str, sample, sorted_names, sorted_values, sw_result, test_str, value, x, z_score;
- chart = nv.models.scatterChart().width(w).height(h).showLegend(false);
+ var W, all_samples, chart, data, intercept, make_data, names, pvalue, pvalue_str, slope, sorted_names, sorted_values, sw_result, test_str, x, z_scores;
+ chart = nv.models.scatterChart().width(w).height(h).showLegend(true).color(d3.scale.category10().range());
+ chart.pointRange([50, 50]);
+ chart.legend.updateState(false);
chart.xAxis.axisLabel("Theoretical quantiles").tickFormat(d3.format('.02f'));
chart.yAxis.axisLabel("Sample quantiles").tickFormat(d3.format('.02f'));
chart.tooltipContent(function(obj) {
return '<b style="font-size: 20px">' + obj.point.name + '</b>';
});
+ all_samples = samples[sample_group];
names = (function() {
var j, len, ref, results;
- ref = _.keys(samples);
+ ref = _.keys(all_samples);
results = [];
for (j = 0, len = ref.length; j < len; j++) {
x = ref[j];
@@ -61,14 +64,14 @@
return results;
})();
sorted_names = names.sort(function(x, y) {
- return samples[x] - samples[y];
+ return all_samples[x] - all_samples[y];
});
sorted_values = (function() {
var j, len, results;
results = [];
for (j = 0, len = sorted_names.length; j < len; j++) {
x = sorted_names[j];
- results.push(samples[x]);
+ results.push(all_samples[x]);
}
return results;
})();
@@ -76,31 +79,39 @@
W = sw_result.w.toFixed(3);
pvalue = sw_result.p.toFixed(3);
pvalue_str = pvalue > 0.05 ? pvalue.toString() : "<span style='color:red'>" + pvalue + "</span>";
- test_str = "Shapiro-Wilk test statistic = " + W + " (p = " + pvalue_str + ")";
- data = [
- {
- slope: jStat.stdev(sorted_values),
- intercept: jStat.mean(sorted_values),
- size: 10,
+ test_str = "Shapiro-Wilk test statistic is " + W + " (p = " + pvalue_str + ")";
+ z_scores = get_z_scores(sorted_values.length);
+ slope = jStat.stdev(sorted_values);
+ intercept = jStat.mean(sorted_values);
+ make_data = function(group_name) {
+ var sample, value, z_score;
+ return {
+ key: js_data.sample_group_types[group_name],
+ slope: slope,
+ intercept: intercept,
values: (function() {
var j, len, ref, ref1, results;
ref = _.zip(get_z_scores(sorted_values.length), sorted_values, sorted_names);
results = [];
for (j = 0, len = ref.length; j < len; j++) {
ref1 = ref[j], z_score = ref1[0], value = ref1[1], sample = ref1[2];
- results.push({
- x: z_score,
- y: value,
- name: sample
- });
+ if (sample in samples[group_name]) {
+ results.push({
+ x: z_score,
+ y: value,
+ name: sample
+ });
+ }
}
return results;
})()
- }
- ];
+ };
+ };
+ data = [make_data('samples_primary'), make_data('samples_other')];
console.log("THE DATA IS:", data);
d3.select("#prob_plot_container svg").datum(data).call(chart);
$("#prob_plot_title").html("<h3>Normal probability plot</h3>" + test_str);
+ $("#prob_plot_container .nv-legendWrap").toggle(sample_group === "samples_all");
return chart;
};
})(this));
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.coffee b/wqflask/wqflask/static/new/javascript/show_trait.coffee
index f2832316..3caa16d9 100755
--- a/wqflask/wqflask/static/new/javascript/show_trait.coffee
+++ b/wqflask/wqflask/static/new/javascript/show_trait.coffee
@@ -138,9 +138,8 @@ $ ->
redraw_bar_chart = ->
root.bar_chart.redraw(root.selected_samples[root.bar_chart_group])
- # TODO: add group selector
redraw_prob_plot = ->
- root.redraw_prob_plot_impl(root.selected_samples['samples_all'])
+ root.redraw_prob_plot_impl(root.selected_samples, root.prob_plot_group)
make_table = ->
header = "<thead><tr><th>&nbsp;</th>"
@@ -428,16 +427,24 @@ $ ->
root.histogram_group = 'samples_primary'
root.histogram = new Histogram(sample_lists[0])
+ $('.histogram_samples_group').val(root.histogram_group)
$('.histogram_samples_group').change ->
root.histogram_group = $(this).val()
redraw_histogram()
root.bar_chart_group = 'samples_primary'
root.bar_chart = new Bar_Chart(sample_lists[0])
+ $('.bar_chart_samples_group').val(root.bar_chart_group)
$('.bar_chart_samples_group').change ->
root.bar_chart_group = $(this).val()
redraw_bar_chart()
+ root.prob_plot_group = 'samples_primary'
+ $('.prob_plot_samples_group').val(root.prob_plot_group)
+ $('.prob_plot_samples_group').change ->
+ root.prob_plot_group = $(this).val()
+ redraw_prob_plot()
+
# new Box_Plot(sample_lists[0])
# $('.box_plot_samples_group').change ->
diff --git a/wqflask/wqflask/static/new/javascript/show_trait.js b/wqflask/wqflask/static/new/javascript/show_trait.js
index 2f2b0aa0..1cd07155 100755
--- a/wqflask/wqflask/static/new/javascript/show_trait.js
+++ b/wqflask/wqflask/static/new/javascript/show_trait.js
@@ -150,7 +150,7 @@
return root.bar_chart.redraw(root.selected_samples[root.bar_chart_group]);
};
redraw_prob_plot = function() {
- return root.redraw_prob_plot_impl(root.selected_samples['samples_all']);
+ return root.redraw_prob_plot_impl(root.selected_samples, root.prob_plot_group);
};
make_table = function() {
var header, i, key, len, ref, ref1, row, row_line, table, the_id, the_rows, value;
@@ -453,16 +453,24 @@
_.mixin(_.str.exports());
root.histogram_group = 'samples_primary';
root.histogram = new Histogram(sample_lists[0]);
+ $('.histogram_samples_group').val(root.histogram_group);
$('.histogram_samples_group').change(function() {
root.histogram_group = $(this).val();
return redraw_histogram();
});
root.bar_chart_group = 'samples_primary';
root.bar_chart = new Bar_Chart(sample_lists[0]);
+ $('.bar_chart_samples_group').val(root.bar_chart_group);
$('.bar_chart_samples_group').change(function() {
root.bar_chart_group = $(this).val();
return redraw_bar_chart();
});
+ root.prob_plot_group = 'samples_primary';
+ $('.prob_plot_samples_group').val(root.prob_plot_group);
+ $('.prob_plot_samples_group').change(function() {
+ root.prob_plot_group = $(this).val();
+ return redraw_prob_plot();
+ });
make_table();
edit_data_change();
$('#edit_sample_lists').change(edit_data_change);
diff --git a/wqflask/wqflask/templates/show_trait_statistics_new.html b/wqflask/wqflask/templates/show_trait_statistics_new.html
index e5f16f9b..15fc2cf7 100755
--- a/wqflask/wqflask/templates/show_trait_statistics_new.html
+++ b/wqflask/wqflask/templates/show_trait_statistics_new.html
@@ -91,10 +91,28 @@
</div>
</div>
<div class="tab-pane" id="probability_plot">
- <div id="prob_plot_container">
- <div id="prob_plot_title"></div>
- <svg></svg>
+ <div style="padding: 20px" class="form-horizontal">
+ {% if sample_groups|length != 1 %}
+ <select class="prob_plot_samples_group">
+ {% for group, pretty_group in sample_group_types.items() %}
+ <option value="{{ group }}">{{ pretty_group }}</option>
+ {% endfor %}
+ </select>
+ <br><br>
+ {% endif %}
+
+ <div id="prob_plot_container">
+ <div id="prob_plot_title"></div>
+ <svg></svg>
+ </div>
+
+ <div>
+ More about <a href="http://en.wikipedia.org/wiki/Normal_probability_plot" target="_blank">Normal Probability Plots</a> and more
+ about interpreting these plots from the <a href="/glossary.html#normal_probability" target="_blank">glossary</a></td>
+ </div>
+
</div>
+
</div>
<!-- <div class="tab-pane" id="box_plot_tab">
{% if sample_groups|length > 1 %}