应用滤镜后dc.js热图颜色范围未更新 [英] dc.js heatmap colour range not getting updated after filter applied

问题描述

我正在使用dc.js创建一个仪表板，该数据集包含24年内从1年开始的3种类型的读数.(在小提琴示例中，我仅用15天来演示)

I'm using dc.js to create a dashboard, the dataset contains 3 types of reading from 1 year in a 24 hour basis. (in the example fiddle, i only use 15 days just for demonstration purpose)

这里是指向JSFiddle的链接，以更好地说明我的问题 http://jsfiddle.net/table315/hLzLzhss/

Here is the link to a JSFiddle to better illustrate my problem http://jsfiddle.net/table315/hLzLzhss/

我使用了一个行图来显示每个读数的总数，并使用了一个热图来显示每个时间每天的总读数.

I've used a row chart to show the total of each reading, and a heatmap to show the total reading of each day at each time.

从行图中选择一种读取类型后，热图似乎不会重新计算色域的最小值和最大值.(即使该值在当前过滤后的数据集中是最高的，加热箱也会显示浅色.)

When 1 type of reading from the row chart has selected, the heatmap doesn't seems to recalculate the min and max of the colour domain. (a heatbox shows a light colour even the value is the highest in the current filtered dataset. )

dayAndTimeChart
  .width(30 * 24 + 500)
  .height(20 * 31)
  .dimension(dayAndTimeDimension)
  .group(dayAndTimeGroup)
  .keyAccessor(function(d) {
    return d.key[0];
  })
  .valueAccessor(function(d) {
    return d.key[1];
  })
  .colorAccessor(function(d) {
    return d.value;
  })
  .colors(["#fff7ec", "#fee8c8", "#fdd49e", "#fdbb84", "#fc8d59", "#ef6548", "#d7301f", "#b30000", "#7f0000"])
  .calculateColorDomain()
  .title(function(d) {
    return "Time:   " + d.key[0] + "\n" +
      "Day:  " + d.key[1] + "\n" +
      "value: " + d.value;
  });

我这里缺少什么吗?还是一个错误?如果是这种情况，有什么解决方法吗?

Is there something I'm missing here? or is it a bug? if that is the case, is there any workaround?

推荐答案

这是设计使然，因为颜色映射可能具有某些绝对含义.

This is by design, because the color mapping may have some absolute meaning.

因此，如果您希望域调整并为每组新值显示完整的颜色范围，则每次重绘图表时都需要 calculateColorDomain():

So if you want the domain to adjust and show the full range of colors for each new set of values, you need to calculateColorDomain() each time the chart is redrawn:

.on('preRedraw', function() {
    dayAndTimeChart.calculateColorDomain();
})

您的提琴的工作叉: http://jsfiddle.net/gordonwoodhull/w1mzwv8d/2/

这篇关于应用滤镜后dc.js热图颜色范围未更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！