问题描述
我正在使用jquery flot库绘制条形图.我图表中的条形图总是太细,宽度大约2像素.但是当我设定 lineWidth:15条形变为我想要的宽度,但是第一个和最后一个条溢出在图形边框上.我发现了一个简单的测试浮点条形图,其点数有限,在本地实施时看起来不错.我的结论是,也许我有太多数据,因此与点数相比,这些条形很细.但是我希望有一种方法可以使条形变得更宽一些,并且不会溢出图形边界.任何建议,不胜感激.这是我所拥有的:
I'm using jquery flot library to plot a bar chart. The bars in my chart are consistantly too thin, about 2px in width. But when I set lineWidth: 15the bars become the width I want, but the first and the last bars spill over the graph border. I found a simple test flot bar chart with a limited number of points, which looks fine when implemented locally. My conclusion is that maybe I have way too much data, and so the bars are thin in contrast to the amount of points. But I'm hoping there is a way to get the bars to be wider some other way and for them not to spill over the graph border.Any suggestions are much appreciated. Here is what I have:
$.plot(this.get('datasets'), {
bars: {
show: true,
align: "center",
fill: true,
//lineWidth: 15
},
xaxis: {
mode: "time", //"categories",
timezone: "browser",
tickLength: 0
}
});
推荐答案
您使用的是lineWidth而不是barWidth.因此,您的条形宽度相同.它们看起来更粗(并溢出边界),因为它们周围的线很粗.
You're using lineWidth instead of barWidth. So your bars are the same width; they just look thicker (and spill over the border) because the lines around them are thick.
条形图之所以如此之窄是因为宽度是用轴单位而不是像素表示的.在您使用时间模式轴的情况下,条形宽度会很大.如果您希望一个酒吧覆盖一个小时,那么您的barWidth应该为60 * 60 * 1000 = 3600000.
The reason why your bars are so narrow are because the width is expressed in axis units, not pixels. In your case, where you're using a time-mode axis, the bar width will be quite large. If you want a bar to cover one hour, then your barWidth should be 60 * 60 * 1000 = 3600000.
这篇关于jQuery Flot条形图条形宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!