Mikko Ohtamaa
Mikko Ohtamaa

Reputation: 83488

Pie style progress bar with CSS3?

Are there any libraries or examples how to create pie style progress bars with CSS3?

Upvotes: 0

Views: 1200

Answers (3)

Litek
Litek

Reputation: 4888

Pie chart is possible in pure css but animating it may not be easy.

Upvotes: 1

DirectXMan12
DirectXMan12

Reputation: 683

another great choice for SVG based graphs is d3.js. It is the successor to the Protovis library, but is much more flexible and much better written (and thus better preforming). Also, you can style some properties of SVG elements with CSS3, but not as much as you can style HTML. However, CSS is still useful, and you can still, for example, use transitions on some properties. Take a look at the W3C's Styling SVG document (although be aware that it just discusses CSS2).

Upvotes: 1

Rich Bradshaw
Rich Bradshaw

Reputation: 72975

Canvas or SVG would be a better fit than CSS for this. (Due to lack of circle segments). Raphaël might be a good choice if you go for SVG. Here's a (non-animated) pie chart, which will show you how to draw segments.

Upvotes: 1

Related Questions