DC.js - 取消选择功能或过滤除单击的功能之外的所有功能

Question

我不确定这是否可能，也没有运气研究这个。我正在使用 DC.js 图表和交叉过滤器.js在仪表板上工作。我将使用行图作为示例。而不是单击要过滤的项目，是否可以做相反的事情？

例如。当我单击行图中的项目时，它将取消选择该项目并过滤其余其他项目，而不是过滤该选定项目。然后我会继续点击其他项目来取消选择。

我的目标几乎是实现一项功能，用户可以按住"CTRL 键"并"左键单击"行图中的项目以取消选择。这样，用户就无需单击行图中超过 50+ 个项目进行筛选，并且很少有项目不进行筛选。

我确实有一个代码，其中Javascript检测到"CTRL"和"左键单击"触发的事件。 但不确定如何过滤除单击的那些之外的所有内容。

我希望这是有道理的。我试图查看 DC.js 或交叉过滤器 api，但我找不到可以做到这一点的函数，或者我错过了什么。

Answer 1

听起来您想要相同的行为，除了第一次单击，您希望保留其他所有内容并在按下ctrl时删除单击的项目。

如果选择了任何内容，则无论是否按ctrl，都应像往常一样切换单击。

正如伊森所建议的那样，您可能可以将其实现为filterHandler。这也应该有效，但由于它基本上是相同的行为，我建议使用onClick的覆盖。

不幸的是，覆盖此方法的技术并不漂亮，但它有效！

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();
};

我使用alt键而不是 ctrl，因为在 Mac 上按住ctrl 单击是右键单击的同义词。

Answer 2

我在需要此功能的行图上使用它。
它比另一个答案短一点，也许它对某人有用(我不知道哪个更好)。

// select only one category at a time
mychart.onClick = function(_chart){ return function (d) {
var filter = _chart.keyAccessor()(d);
dc.events.trigger(function () {
_chart.filter(null);
_chart.filter(filter);
_chart.redrawGroup();
});
}; }(mychart)

其中mychart是您的dc.rowchart的名称

var mychart = dc.rowChart('#mychart');

[编辑]

这个也可以，更短，并且可以与条形图

mychart.addFilterHandler(function (filters, filter) {
filters.length = 0; // empty the array
filters.push(filter);
return filters;
});