scale gene viewer data according min/max in all time points. see #36.

Author: kemaleren

app/pods/components/pv-wrapper/component.js

@@ -13,6 +13,7 @@ export default Ember.Component.extend({
   // bound
   structure: null,
   data: [],
+  range: [0, 1],
 
   // created
   viewer: null,
@@ -62,7 +63,7 @@ export default Ember.Component.extend({
 
   updateColors: function() {
     Ember.run.once(this, '_updateColors');
-  }.observes('data.[]', 'structure', 'geometry'),
+  }.observes('data.[]', 'range.[]', 'structure', 'geometry'),
 
   _updateColors() {
     var geometry = this.get('geometry');
@@ -76,24 +77,34 @@ export default Ember.Component.extend({
     var gradient = pv.color.gradient(['white', 'darkred']);
     if (data) {
       // remap to [0, 1], since pv's stops seems broken
+      var range = this.get('range');
       minval = d3.min(data);
       maxval = d3.max(data);
-      if (-minval === maxval) {
+      if (range[0] > minval) {
+        throw {name: 'RangeError', message: 'range[0] too large'};
+      }
+      if (range[1] < maxval) {
+        throw {name: 'RangeError', message: 'range[1] too small'};
+      }
+      if (range[0] < 0) {
         // TODO: get gradient stops working, so this is unnecessary
+        // map [range[0], 0] to [0, 0.5]
+        // map [0, range[1]] to [0, 0.5]
         gradient = pv.color.gradient(['darkblue', 'white', 'darkred']);
       }
-      var range = maxval - minval;
-      data = _.map(data, d => (d - minval) / range);
+      data = _.map(data, d => (d - range[0]) / (range[1] - range[0]));
+
+      structure.eachResidue(function(res) {
+        var ref_coord = res.num();
+        var val = data[ref_coord];
+        val = (val === undefined ? 0 : val);
+        res.customData = function() {return val;};
+      });
+      var newrange = [0, 1];
+      var colorOp = pv.color.byResidueProp('customData', gradient, newrange);
+      geometry.colorBy(colorOp);
+      this.get('viewer').requestRedraw();
     }
-    structure.eachResidue(function(res) {
-      var ref_coord = res.num();
-      var val = data[ref_coord];
-      val = (val === undefined ? 0 : val);
-      res.customData = function() {return val;};
-    });
-    var colorOp = pv.color.byResidueProp('customData', gradient);
-    geometry.colorBy(colorOp);
-    this.get('viewer').requestRedraw();
   },
 
   labelResidues: function() {

app/pods/session/gene/controller.js

@@ -92,43 +92,58 @@ export default Ember.Controller.extend({
   }.property('selectedMetric', 'divergence', 'entropy', 'meanDN'),
 
   structureData: function() {
-    var idx = this.get('selectedTimepointIdx');
-    if (idx >= this.get('names.length')) {
-      // a hack; presumable selectedIdx will be updated later
-      idx = this.get('names.length') - 1;
-    }
     var metric = this.get('selectedMetric');
     if (metric === "Entropy") {
-      return this.get('entropy')[idx];
+      return this.get('entropy');
     }
     if (metric === "JS Divergence") {
-      return this.get('divergence')[idx];
+      return this.get('divergence');
     }
-    var dn = this.get('meanDN');
-    var ds = this.get('meanDS');
-    var zipped = _.zip(dn[idx], ds[idx]);
-    // TODO: do not hardcode these values
-    // FIXME: fix issue when number of timepoints changes; selector should remain on current one if possible
-    var upper = Math.log(5);
-    var lower = Math.log(1/5);
-    var ratios = zipped.map(function(pair) {
-      var result = Math.log(pair[0] / pair[1]);
-      // cap extreme values
-      if (result > upper) {
-        result = upper;
-      } else if (result < lower) {
-        result = lower;
+    if (metric === 'dNdS') {
+      var dn = this.get('meanDN');
+      var ds = this.get('meanDS');
+      var result = [];
+      for (let idx=0; idx<dn.length; idx++) {
+        var zipped = _.zip(dn[idx], ds[idx]);
+        var logratios = zipped.map(function(pair) {
+          var logratio = Math.log(pair[0] / pair[1]);
+          return logratio;
+        });
+        result.push(logratios);
       }
       return result;
-    });
-    // take only reference coordinates
-    var coordMap = this.get('model.coordinates.refToFirstAlnCoords');
-    var result = _.map(coordMap, alnCoord => ratios[alnCoord] || 0);
-    return result;
+    }
+    throw {name: 'UnknownMetricError', message: metric};
   }.property('model.coordinates.refToFirstAlnCoords',
              'meanDN', 'meanDS', 'entropy', 'divergence', 'selectedTimepointIdx',
              'selectedMetric'),
 
+  selectedStructureData: function() {
+    var idx = this.get('selectedTimepointIdx');
+    if (idx >= this.get('names.length')) {
+      // a hack; presumable selectedIdx will be updated later
+      idx = this.get('names.length') - 1;
+    }
+    var data = this.get('structureData')[idx];
+    // take only reference coordinates
+    var coordMap = this.get('model.coordinates.refToFirstAlnCoords');
+    var result = _.map(coordMap, alnCoord => data[alnCoord] || 0);
+    return result;
+  }.property('structureData', 'selectedTimepointIdx'),
+
+  structureDataRange: function() {
+    var data = this.get('structureData');
+    var minval = d3.min(data, d => d3.min(d));
+    var maxval = d3.max(data, d => d3.max(d));
+    if (minval < 0 && maxval > 0) {
+      var r = Math.max(Math.abs(minval), maxval);
+      minval = -r;
+      maxval = r;
+    }
+    console.log([minval, maxval]);
+    return [minval, maxval];
+  }.property('structureData'),
+
   timepoints: function() {
     if (this.get('selectedMetric') === "JS Divergence") {
       var divergence = this.get('model.divergence.sortedDivergence');

app/pods/session/gene/template.hbs

@@ -1,5 +1,5 @@
 <div class="pv-viewer">
-{{pv-wrapper structure=model.structure data=structureData}}
+{{pv-wrapper structure=model.structure data=selectedStructureData range=structureDataRange}}
 </div>
 
 <div class="form-horizontal control-group">