Make it so clicking on a bar in the chart filters down to events of that type

static/js/graphing.js

@@ -1410,7 +1410,28 @@ LogUsageChart.prototype.getColor = function(kind) {
 };
 
 
+/**
+ * Handler for when an element in the chart has been clicked.
+ */
+LogUsageChart.prototype.handleElementClicked_ = function(e) {
+  var key = e.series.key;
+  var kind = e.series.kind;
+  var disabled = [];
+
+  for (var i = 0; i < this.data_.length; ++i) {
+    disabled.push(this.data_[i].key != key);
+  }
+
+  this.chart_.dispatch.changeState({ 'disabled': disabled });
+};
+
+
+/**
+ * Handler for when the state of the chart has changed.
+ */
 LogUsageChart.prototype.handleStateChange_ = function(e) {
+    window.console.log(e);
+
   var allowed = {};
   var disabled = e.disabled;
   for (var i = 0; i < this.data_.length; ++i) {
@@ -1481,9 +1502,8 @@ LogUsageChart.prototype.draw = function(container, logData) {
 
     nv.utils.windowResize(chart.update);
 
-    chart.multibar.dispatch.on('elementClick', function(e) { window.console.log(e); });
+    chart.multibar.dispatch.on('elementClick', function(e) { that.handleElementClicked_(e); });
     chart.dispatch.on('stateChange', function(e) { that.handleStateChange_(e); });
-
+    return that.chart_ = chart;
-    return chart;
   });
 };