jQuery Flot条形图条宽

Question

我正在使用jquery flot库绘制条形图。我的图表中的条形宽度始终太窄，大约只有2px。但是当我设置lineWidth: 15时，条形变成了我想要的宽度，但第一个和最后一个条形会溢出图形边界。我找到了一个简单的测试flot条形图，它只有有限数量的点，在本地实现时看起来很好。我的结论是可能我有太多的数据，因此条形相对于点数而言很窄。但我希望能以其他方式使条形变得更宽，并且不会溢出图形边界。非常感谢任何建议。这是我的代码：

$.plot(this.get('datasets'), {
    bars: {
       show: true,
       align: "center",
       fill: true,
       //lineWidth: 15
    },
    xaxis: {
       mode: "time",  //"categories",
       timezone: "browser",
       tickLength: 0
    }                   
});

- lw0

Answer 1

您正在使用 lineWidth 而不是 barWidth。因此，您的条形图宽度都是相同的；它们只是看起来更厚（并且溢出边框），因为它们周围的线条很粗。

之所以您的条形图如此狭窄，是因为宽度是以轴单位而非像素表示的。在您的情况下，您正在使用时间模式轴，此时条形图的宽度将会很大。如果您希望一根条形图覆盖一个小时，则 barWidth 应该为 60 * 60 * 1000 = 3600000。

- DNS

---

太棒了 - 非常感谢，这起了很大的作用！ - lw0

我的 x 轴上没有使用时间模式，而是有一些标签，比如：“汽车”，“卡车”，“飞机”。在这种情况下，该如何确定宽度？ - Burak Karakuş