我有一个dc.js复合图,有一个有序的条形图和折线图。条形图值位于左侧y轴,折线图值位于右侧y轴。
可以对齐线的数据点(位于标记的正上方)?
var oneWayComposite = dcpositeChart('#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(个案数) .rightYAxisLabel(目标密度) .group(grp) pose ([oneWayBar,oneWayLine]);
解决方案
看起来这是一个已知问题。
https:// github/dc-js/dc.js/issues/662
似乎一个解决方法是分配 ._ rangeBandPadding 1)复合图。虽然如github线程中提到的打破条尺寸,所以添加 .gap(1)和 .centerBar(true)到条形图得到一切看起来不错。
I have a dc.js composite chart that has an ordinal bar chart one and a line chart. The bar chart values are on the left y-axis and the line chart values are on the right y-axis.
Is it possible to align the data points for the line in the centre of the bars (directly above the tick-marks)?
var oneWayComposite = dcpositeChart('#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) pose([oneWayBar,oneWayLine]);解决方案
Looks like this is a known issue.
github/dc-js/dc.js/issues/662
Seems like a workaround is to assign ._rangeBandPadding(1) the composite chart. Though as mentioned in the github thread that breaks the bar sizes, so adding .gap(1) and .centerBar(true) to the bar chart got everything looking nice.
更多推荐
对齐棒中心点(DC.JS复合图)
发布评论