css - 使用 CSS 创建负条形图

标签 css charts data-visualization

我已经问过一个非常相似的问题,但那是使用 javascript/php - 我没有找到理想的解决方案,所以想尝试使用看起来类似于下面的 CSS 来模拟图表

如您所见,图表行有一个以不同颜色和黑色边框覆盖的次要元素。这是我正在努力实现的风格 - 谁能建议如何最好地做到这一点?

谁能提出解决这个问题的最佳方法,即创建另一个叠加在另一个图表之上的图表?

negative bar chart

最佳答案

我尝试用纯 CSS 制作图表 http://dabblet.com/gist/3142994

...和第二个版本,HTML 更少,CSS 更清晰:http://dabblet.com/gist/3143479

关于css - 使用 CSS 创建负条形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11559061/

相关文章:

javascript - 动画图表从页面的特定部分开始

c# - 在饼图中隐藏标签(MS Chart for .Net)

recursion - HTML 中树层次结构的可视化

html - CSS 悬停在水平行

css - 固定位置的元素未出现在正确的位置

图像上的 Firefox 中的 CSS3 动画不透明度

javascript - 如何在 d3.js 中的兄弟元素之后插入

CSS/SVG 剪辑路径在 Firefox 中不起作用

javascript - 使用投影线绘制简单图形

r - R的ASCII绘图功能