SVG

Using gradient stops and transparency we can fill circle partially in svg. Doing this dynamically using data may be great visualization tool. We will use d3 to do this.

Here is how to tutorial on creating filled circle to visualize data using svg and tiny bit of javascript.