An SVG Bar chart styled to look like a Vertical Progress bar

This is a demo of two Bar charts that have been customised to take on the appearance of a Vertical Progress bar. The outer bar chart is given a value of 100 so that the "background" goes all the way to the top. And then another Bar chart with the real value is drawn on top. Since it's a Bar chart, the grow() effect can be used.

This goes in the documents header:

<script src="RGraph.svg.common.core.js"></script>
<script src="RGraph.svg.common.tooltips.js"></script>
<script src="RGraph.svg.bar.js"></script>

Put this where you want the chart to show up:

<div style="padding: 15px">
    <div style="width: 100px; height: 300px" id="chart-container"></div>
</div>

This is the code that generates the chart: