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

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

align: "center" 

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

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

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

Answer 1

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

1. 您忘记在示例中使用轴标签插件。图中没有内置支持轴标签。您需要使用第三方插件。 请参阅Flot插件以获取轴标签

2. 有关您的条形边缘被切割的问题，您可以参考带有对齐中心的条形图以下更新的代码适用于我

}

 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以考虑条宽和居中。 鉴于您已经有滑块来指定这些值，这应该很容易。