DC.js - deselect feature or filter all but the ones that are clicked

Question

I\'m not sure if this is possible and no luck on researching this. I\'m working on a dashboard using DC.js charts and crossfilter.js. I\'m going to use a Row chart as an example

Answer 1

It sounds like you want the same behavior except for the very first click, where you want to keep everything else and remove the clicked item if ctrl is pressed.

If there is anything selected, then a click should toggle as usual, whether or not ctrl is pressed.

As Ethan suggests, you could probably implement this as a filterHandler. That should work too, but since it's mostly the same behavior, I'd suggest using an override of onClick.

Unfortunately the technique for overriding this method is not pretty, but it works!

  var oldClick = rowChart.onClick;
  rowChart.onClick = function(d) {
      var chart = this;
      if(!d3.event.altKey)
          return oldClick.call(chart, d); // normal behavior if no mod key
      var current = chart.filters();
      if(current.length)
          return oldClick.call(chart, d); // normal behavior if there is already a selection
      current = chart.group().all()
          .map(kv => kv.key)
          .filter(k => k != d.key);
      chart.replaceFilter([current]).redrawGroup();
  };

I used the alt key instead of ctrl because ctrl-click on Macs is a synonym for right-click.