Question

您好我正在尝试绘制一个包含31天数据的条形图。但是当我绘制它时，每个数据的标签不直接位于其条形下方的中心，当我将条形设置为

时

align: "center"

，第一个酒吧和最后一个酒吧被削减了一半。

这是jsfiddle： http://jsfiddle.net/3T6qc/

如何设置它以便我看到完整的条形图并在中间直接放置标签？请注意，我使用flot作为绘图库。

Answer 1

嘿这里有一些关于你的小提琴的注意事项。

您忘记在示例中使用轴标签插件。图中没有内置支持轴标签。您需要使用第三方插件。请参阅Flot plugin for axis label
有关您的酒吧边缘被切割的问题，您可以参考Bar chart with align center 以下更新代码为我工作

}

if (graphMode == "month") {
$( "#hSlider" ).slider( "option", "min", 1.75 ); //add 0.75 offset
$( "#hSlider" ).slider( "option", "max", 31.75 );
$( "#hSlider" ).slider( "option", "values", [ 1, 31 ] );
for (var i = 1; i <= 31; i++) {
    if (i < day)
    {
        d.push([ i, getRandomInt(1200, 1800) ]);
    }
    else
    {
        d.push([ i, 0]);
    }
}
}

因此，您需要稍微更新代码，以便为条形宽度添加偏移量。

Answer 2

这是一个已知问题;你需要通过调整轴最小值和最大值来解决它。例如，如果您有0,1,2的刻度，则需要将min设置为-0.5，将max设置为2.5以考虑条宽和居中。鉴于您已经有滑块来指定这些值，这应该很容易。

条形图条形图与X轴标签对齐

2 个答案: