Add option to hide incomplete comparisions

Author: StanFromIreland

codespeed/static/js/comparison.js

@@ -29,6 +29,7 @@ function getConfiguration() {
     ben: readCheckbox("input[name='benchmarks']:checked"),
     env: readCheckbox("input[name='environments']:checked"),
     hor: $("input[name='direction']").is(':checked'),
+    com: $("input[name='common_only']").is(':checked'),
     bas: $("#baseline option:selected").val() || "none",
     chart: $("#chart_type option:selected").val()
   };
@@ -141,11 +142,28 @@ function updateGraphTitle(exes, enviros, bens, baseline, chart, chartTitles) {
     $title.text(chartTitles.join(' / '));
 }
 
+// Keep only the benchmarks that have a result for every selected
+// executable/environment pair, so each bar group covers the same set.
+function filterCommonBenchmarks(bens, exes, enviros) {
+    if (!compdata) { return bens; }
+    return bens.filter(function(ben) {
+        return exes.every(function(exe) {
+            return enviros.every(function(env) {
+                var val = compdata[exe] && compdata[exe][env]
+                    ? compdata[exe][env][ben]
+                    : null;
+                return val !== null && val !== undefined;
+            });
+        });
+    });
+}
+
 function refreshContent() {
   var conf = getConfiguration(),
       exes = conf.exe.split(","),
       bens  = conf.ben.split(","),
       enviros = conf.env.split(","),
+      hiddenCount = 0,
       msg = "";
 
   $("#graph-title").html("");
@@ -159,7 +177,19 @@ function refreshContent() {
   } else if (enviros[0] === "") {
     $("#plotwrapper").html('<p class="warning">No environments selected</p>');
     return false;
-  } else if (conf.chart === "relative bars" && conf.bas === "none") {
+  }
+
+  if (conf.com) {
+    var common = filterCommonBenchmarks(bens, exes, enviros);
+    hiddenCount = bens.length - common.length;
+    bens = common;
+    if (bens.length === 0) {
+      $("#plotwrapper").html('<p class="warning">No benchmark has results for every selected executable and environment</p>');
+      return false;
+    }
+  }
+
+  if (conf.chart === "relative bars" && conf.bas === "none") {
     msg = '<p class="warning">For relative bar charts, you must select a baseline to normalize to.</p>';
     $("#plotwrapper").html(msg);
     return false;
@@ -183,6 +213,14 @@ function refreshContent() {
     }
   }
 
+  var hiddenMsg = "";
+  if (hiddenCount > 0) {
+    hiddenMsg = '<p class="warning">' + hiddenCount + ' benchmark' +
+      (hiddenCount === 1 ? '' : 's') +
+      ' hidden because not every selected executable has a result for ' +
+      (hiddenCount === 1 ? 'it' : 'them') + '.</p>';
+  }
+
   chartInstances.forEach(function(c) { c.destroy(); });
   chartInstances = [];
   $("#plotwrapper").fadeOut("fast", function() {
@@ -204,6 +242,8 @@ function refreshContent() {
       var t = renderComparisonPlot(plotid, unit, benchmarks, exes, enviros, conf.bas, conf.chart, conf.hor);
       chartTitles.push(t);
     }
+    // Shown below the chart(s) so it does not push them down
+    $("#plotwrapper").append(hiddenMsg);
     updateGraphTitle(exes, enviros, bens, conf.bas, conf.chart, chartTitles);
   });
 }
@@ -445,6 +485,7 @@ function init(defaults) {
     // Set default values
     $("#chart_type").val(defaults.chart_type);
     $("#direction").prop('checked', defaults.direction === "True");
+    $("#common_only").prop('checked', defaults.common_only === "True");
 
     /*
     var sel = $("input[name='executables']");
@@ -477,7 +518,7 @@ function init(defaults) {
     $("#benchmark .checkall, #benchmark .uncheckall").click(loadData);
 
     // Re-render without re-fetching for other controls
-    $("#chart_type, #baseline, #direction").change(refreshContent);
+    $("#chart_type, #baseline, #direction, #common_only").change(refreshContent);
     $("input[name='environments']").change(function() {
         updateBaselineDropdown();
         refreshContent();
@@ -536,6 +577,9 @@ function init(defaults) {
         var exes = conf.exe ? conf.exe.split(",").filter(Boolean) : [];
         var enviros = readCheckbox("input[name='environments']:checked").split(",").filter(Boolean);
         var benchmarks = conf.ben ? conf.ben.split(",").filter(Boolean) : [];
+        if (conf.com) {
+            benchmarks = filterCommonBenchmarks(benchmarks, exes, enviros);
+        }
 
         // Header row: benchmark, then one column per exe@env
         var header = ["benchmark"];

codespeed/templates/codespeed/comparison.html

@@ -78,6 +78,10 @@
     <label for="direction">Horizontal:</label>
     <input id="direction" type="checkbox" name="direction" value="horizontal"/>
   </span>
+  <span class="options" title="Only show benchmarks that have a result for every selected executable and environment">
+    <label for="common_only">Hide incomplete:</label>
+    <input id="common_only" type="checkbox" name="common_only" value="common"/>
+  </span>
   {% comment %}Bootstrap Icons "download" glyph (MIT, twbs/icons).{% endcomment %}
   <a id="exportcsv" href="#"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5"/><path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708z"/></svg>Export CSV</a>
   {% include "codespeed/permalink.html" %}
@@ -99,6 +103,7 @@
       chart_type: "{{ selectedchart }}",
       baseline: "{{ selectedbaseline }}",
       direction: "{{ selecteddirection }}",
+      common_only: "{{ selectedcommon }}",
       executables: [{% for e in checkedexecutables %}"{{ e }}",{% endfor %}],
       benchmarks: [{% for b in checkedbenchmarks %}{{ b.id }},{% endfor %}],
       environments: [{% for e in checkedenviros %}{{ e.id }},{% endfor %}],

codespeed/views.py

@@ -476,6 +476,10 @@ def comparison(request):
             settings.CHART_ORIENTATION == 'horizontal'):
         selecteddirection = True
 
+    # Hide benchmarks that lack a result for any selected executable, so
+    # every bar group covers the same set of benchmarks.
+    selectedcommon = data.get('com') == 'true'
+
     return render(request, 'codespeed/comparison.html', {
         'checkedexecutables': checkedexecutables,
         'checkedbenchmarks': checkedbenchmarks,
@@ -487,7 +491,8 @@ def comparison(request):
         'charts': charts,
         'selectedbaseline': selectedbaseline,
         'selectedchart': selectedchart,
-        'selecteddirection': selecteddirection
+        'selecteddirection': selecteddirection,
+        'selectedcommon': selectedcommon,
     })
 
 def get_setting(name, default = None):