Question

我有很多图表，为简单起见，我需要this example on jsfiddle，其中有一个画笔图表，一个按时间键入的条形图和一些键入某些类别的行图表。另外，我使用d3-tip库作为工具提示（在我的提示的非常简化版本的链接中）。

为了避免在rowChart中创建条形行，我使用了dc-js（以及here的常见问题解答中列出的假组。

假组合效果不错，而不是在行图表上显示C类别。

但是，如果我用0数据刷几个月，当我重置过滤器时（只需点击除了刷子图表上的过滤区域以外的任何地方），行图上的d3-tip就会消失。

请注意，如果创建的组没有 fake-grouping-function ，则不会出现此问题。

任何解释为何会发生这种情况？
如何避免这种情况（不会丢失remove_empty_bins）？

Answer 1

虽然你可以互换地使用dc.js和d3.js，并且dc.js故意是一个＆＃34;漏洞抽象＆＃34;如果你用惯用的dc.js方式做一些事情会更好。< / p>

我有两点建议：

应用您的工具提示以响应dc.js事件，以便在创建（或重新创建）新图形对象时重新应用它们。
修改图表时，请使用chart.selectAll代替d3.selectAll。

好的，＃2实际上与这个问题没有关系，但它确实有助于更好地选择范围，以便他们更难以错过图表或意外修改页面中其他地方的内容。

实现＃1看起来像这样：

month_chart.on('pretransition', function(chart) {
  chart.selectAll('rect.bar').call(month_tip)
    .on('mouseover', month_tip.show).on('mouseout', month_tip.hide);
});
loc_chart1.on('pretransition', function(chart) {
  chart.selectAll('g.row').call(loc_tip)
    .on('mouseover', loc_tip.show).on('mouseout', loc_tip.hide);
});

pretransition事件在渲染或重绘后立即触发，因此它通常是操纵dc元素的最佳时刻。比全局运行代码要好得多。我喜欢设置所有内容，然后调用dc.renderAll()，然后允许渲染和重绘以后自行处理。

特别是，当remove_empty_bins停止删除这些栏时，会重新添加这些栏，这些事件会将其取出并重新提示。

你小提琴的叉子：https://jsfiddle.net/gordonwoodhull/5feL3gko/4/

dc-js图表上的d3-tip在过滤0值组时消失

1 个答案: