在酒吧中心對齊點（DC.JS複合圖表）

Question

我有一個dc.js複合圖表，它有一個序號條形圖和折線圖。條形圖值位於左側y軸上，折線圖值位於右側y軸上。

是否可以將條形中心的直線數據點（直接位於刻度標記上方）對齊？

var oneWayComposite = dc.compositeChart('#chart'); 


var oneWayBar = dc.barChart(oneWayComposite) 
     .dimension(featureDim) 
     .barPadding(1) 
     .group(grp) 
     // .centerBar(true) 
     .valueAccessor(function(p) {return p.value.count; }); 


var oneWayLine = dc.lineChart(oneWayComposite) 
     .dimension(featureDim) 
     .group(grp) 
     .colors('#000000') 
     .renderArea(false) 
     // .interpolate('basis') 
     .useRightYAxis(true) 
     .valueAccessor(function(p) {return p.value.density; }); 

oneWayComposite.width(width) 
    .margins(mrgn) 
    .height(height) 
    .x(d3.scale.ordinal()) 
    .xUnits(dc.units.ordinal) 
    .yAxisLabel("Count of Cases") 
    .rightYAxisLabel("Target Density") 
    .group(grp) 
    .compose([oneWayBar,oneWayLine]); 

Answer 1

看起來這是一個已知的問題。

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

似乎是一個解決方法是將分配._rangeBandPadding(1)複合圖表。雖然正如github線程中提到的那樣，打破了條形的大小，所以在條形圖中添加.gap(1)和.centerBar(true)讓所有內容都看起來不錯。