首页 文章

对齐条形中心点（DC.JS复合图）

提问于
浏览 次
1

我有一个dc.js复合图表，它有一个序数条形图和折线图 . 条形图值位于左侧y轴上，折线图值位于右侧y轴上 .

是否可以在条形中心（直接在刻度标记上方）对齐线条的数据点？

enter image description here

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]);
d3.js charts dc.js

1 回答

  • 2

    看起来这是一个已知问题 .

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

    似乎解决方法是分配 ._rangeBandPadding(1) 复合图表 . 虽然在github线程中提到了打破条形大小，但是在条形图中添加 .gap(1) 和 .centerBar(true) 使得一切看起来都很好 .

    回复于

相关问题