Question

使用dc.js和较小的数据集创建条形图时，我可以看到条形图和间隙看起来非常一致。

当使用更大的数据集和d3.scale.linear（）时，我无法使用条形图和间隙看起来像使用日期图表和d3.time.scale（）时那样好。

条形太薄或太厚而没有间隙 - http://neil-s.com/unison/crossfilter/test/Crossfilter.jpg

以下是上图中顶部条形图之一的示例代码：

var tempDim = xFilter.dimension(function(d) {return d.temp;}); 
var tempCount = tempDim.group().reduceCount(function(d) {return d.temp;}); 
var minTemp = tempDim.bottom(1)[0].temp;
var maxTemp = tempDim.top(1)[0].temp;   

tempBarChart    
        .width(375).height(157)         
        .dimension(tempDim) 
        .group(tempCount)       
        .x(d3.scale.linear().domain([minTemp, maxTemp]))    
        .centerBar(true)
        .elasticX(true)
        .gap(15) 
        .xUnits(function(){return 15;}) 
        .xAxis().ticks(6)

我已经尝试了差距，xUnits和滴答值，但没有运气。有什么建议吗？

Answer 1

不漂亮！

这是dc.js的已知错误。我计划修复它2.0。

https://github.com/dc-js/dc.js/issues/952

我认为它在1.7中比在2.0开发分支中稍好一些，但它仍然不完美。

我现在唯一可以想到的解决方法是创建一个在事后调整宽度的renderlet。： - （

在使用大型数据集和d3.scale.linear（）时，使dc.js中的条形宽度和间隙保持一致

1 个答案: