Bar Chart to Show Progress with XSL-CSS Trick
We can generate the simple Bar chart based on SharePoint list data.
Here is how: Just create a list with desired fields, then drop a dataview webpart with the list. Here is the code to generate bar charts. Place them inside the Dataview webpart in appropriate place.
<td>
<span style="width:{format-number(@Completed, '##.#%')}; background-color:blue;"></span></td><td>
<DIV style="position:relative;"><DIV style="background-color:green; width:{format-number(@Completed,'##.#%')}"></DIV>
<DIV style='position:absolute; top:0px;'><xsl:value-of
select="format-number(@Completed, '##.#%')"/></DIV>
</DIV></td>