圆形div栏用于评级html5 js

Hi i was using a bar rating system in my page, it shows by percentage how many points does the usear has by a very simple php code Examle:

if($points>50){
 $level = "Full User";
 $level_bar = "100%";
}

And by the time of load the bar showed 100% filled with another color.

The problem now its doing the filled bar circular, i had the idea of doing it with html5 and i failed, any idea how to do it?

im trying to get this to work: Circular rating bar

A demo made with a canvas element : http://jsfiddle.net/x4pVy/

if you want to show a different percentage, just change the value stored on data-completeness attribute on canvas

the percentage value can be written inside the canvas (through fillText() function) or into another DOM element you could place over the canvas (with css)