Question

我的小提琴有水平条形图;我想在酒吧之间留出更多空间。my fiddle。我可以篡改高度属性（线：101）并降低高度，以便空间看起来增加但我不想改变它们的高度。如何在不改变高度的情况下增加条形间距？

矩形代码

 rects = groups.selectAll('rect')
    .data(function (d) {
    return d;
})
    .enter()
    .append('rect')
    .attr('x', function (d) {
    return xScale(d.x0);
})
    .attr('y', function (d, i) {
    return yScale(d.y);
})
    .attr('height', function (d) {
    return yScale.rangeBand();
})
    .attr('width', function (d) {
    return xScale(d.x);
})

Answer 1

您已经在代码中执行此操作。当你写：

yScale = d3.scale.ordinal()
    .domain(months)
    .rangeRoundBands([0, height], .1);

rangeRoundBands中的第二个参数是条形之间的填充：

ordinal.rangeRoundBands(interval[, padding[, outerPadding]])

所以，你只需要调整那个值。使用0.5：https://jsfiddle.net/catbu2oz/

检查这个小提琴

但如果您正在谈论保持相同的像素高度，那么只有一个解决方案：硬编码条的高度值并增加比例范围，如下所示小提琴：https://jsfiddle.net/3xakLhfo/

我可以在条形矩形之间给出空格而不调整高度属性吗？

1 个答案: