d3 + filtro incrociato: l'asse data esegue il rendering delle barre di pixelthin

Question

Ho trascorso la maggior parte della giornata cercando di ottenere un bell'istogramma dell'asse della data, nella misura in cui sto pubblicando la mia prima domanda sullo stackoverflow.

L'asse e la sovrapposizione sono solo il modo in cui lo voglio, ma i bar sono molto sottili per no (a me) un motivo apparente. In altre parole, apprezzerei molto l'aiuto.

Ecco una versione ridotta a icona (sto usando la libreria dc.js, però io sono abbastanza fiducioso delle sfide è in nome d3 + crossfilters):

var jsonstr = [{"timestamp": "2013-06-13T11:04:24.729Z"},{"timestamp": "2013-06-17T11:03:24.729Z"},{"timestamp": "2013-06-17T11:02:24.729Z"},{"timestamp": "2013-06-19T11:02:14.129Z"}]; 

var ndx = crossfilter(jsonstr); 

var timestampD = ndx.dimension(function (d) { 
    return new Date(d.timestamp); 
}); 

var timestampDG = timestampD.group(function (d) { 
    return d3.time.day(d); 
}); 

var barChart = dc.barChart("#dc-bar"); 
barChart.width(500) 
    .height(250) 
    .dimension(timestampD) 
    .group(timestampDG) 
    .x(d3.time.scale().domain([(new Date(2013,05,12)), (new Date(2013,05,20))]).nice(d3.time.day)) 
    .xAxis().tickFormat(function (x) { 
     return x.getDate() + "/" + (x.getMonth()+1); 
    }); 

dc.renderAll(); 

Answer 1

Credo che il problema è in realtà con il modo stai usando dc.js; non si specifica quale units il barchart dovrebbe essere in Prova questo:.

barChart 
    .width(500) 
    .height(250) 
    .dimension(timestampD) 
    .xUnits(d3.time.days) 
    .ect 

Answer 2

Per chiunque altro abbia questo problema, per il quale la risposta di Adam non sembra di fare nulla, assicurarsi che non si dispone di elasticX impostato su true come ho fatto io.