dc.js 应用过滤器后热图颜色范围未更新
dc.js heatmap colour range not getting updated after filter applied
我正在使用 dc.js 创建一个仪表板,数据集包含 3 种类型的 1 年 24 小时读数。 (在例子中fiddle,我只用了15天只是为了演示)
这是 JSFiddle 的 link 以更好地说明我的问题 http://jsfiddle.net/table315/hLzLzhss/
我用了一个柱形图来显示每次阅读的总和,用一个热图来显示每天每个时间的总阅读量。
当从行图中选择了一种类型的读数时,热图似乎没有重新计算色域的最小值和最大值。 (即使该值是当前过滤数据集中最高的值,热箱也会显示浅色。)
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;
});
我在这里遗漏了什么吗?或者这是一个错误?如果是这样,有什么解决方法吗?
这是设计使然,因为颜色映射可能具有某些绝对含义。
因此,如果您希望域调整并显示每组新值的全部颜色范围,则每次重新绘制图表时都需要 calculateColorDomain()
:
.on('preRedraw', function() {
dayAndTimeChart.calculateColorDomain();
})
你的 fiddle 的工作叉:http://jsfiddle.net/gordonwoodhull/w1mzwv8d/2/
我正在使用 dc.js 创建一个仪表板,数据集包含 3 种类型的 1 年 24 小时读数。 (在例子中fiddle,我只用了15天只是为了演示)
这是 JSFiddle 的 link 以更好地说明我的问题 http://jsfiddle.net/table315/hLzLzhss/
我用了一个柱形图来显示每次阅读的总和,用一个热图来显示每天每个时间的总阅读量。
当从行图中选择了一种类型的读数时,热图似乎没有重新计算色域的最小值和最大值。 (即使该值是当前过滤数据集中最高的值,热箱也会显示浅色。)
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;
});
我在这里遗漏了什么吗?或者这是一个错误?如果是这样,有什么解决方法吗?
这是设计使然,因为颜色映射可能具有某些绝对含义。
因此,如果您希望域调整并显示每组新值的全部颜色范围,则每次重新绘制图表时都需要 calculateColorDomain()
:
.on('preRedraw', function() {
dayAndTimeChart.calculateColorDomain();
})
你的 fiddle 的工作叉:http://jsfiddle.net/gordonwoodhull/w1mzwv8d/2/