bootstrap柱形图

Question

有没有办法让我可以将bootstrap进度条横向转向将它们用作柱形图？ 我正在考虑使用Google图表，但使用bootstrap更容易。 这里有一些代码可以超越StackOverflow质量标准。

Code goes here.

Answer 1

这是一种解决方法。它不是那么好但它很短而且有效。

用法：它与通常的进度条非常相似，但有两点不同：

1. 您应该设置条形高度，而不是宽度
2. 进度条高度已修复（但可以使用内联样式更改）

CSS：

.progress-vertical {
    width: 20px;
    height: 100px !important;
    position: relative;
}
.progress-vertical .bar {
    width: 100% !important;
    position: absolute;
    bottom: 0;
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
}

示例：http://jsfiddle.net/mQzj9/251/

编辑1 ：修复了错误的示例链接。

编辑2 ：感谢Pavlo Mykhalov，不再需要jQuery代码（CSS更新）

编辑3 ：CSS链接已过时，已更新。